@charset "UTF-8"; /* CSS Document */ //ブレイクポイントを指定------ここから $xl: 1399px; $lg: 1199px; $md: 991px; $sm: 767px; $xs: 575px; @mixin xl { @media screen and (max-width: ($xl)) { @content; } } @mixin lg { @media screen and (max-width: ($lg)) { @content; } } @mixin md { @media screen and (max-width: ($md)) { @content; } } @mixin sm { @media screen and (max-width: ($sm)) { @content; } } @mixin xs { @media screen and (max-width: ($xs)) { @content; } } //ブレイクポイントを指定------ここまで //メインカラー指定 $color-pink: #ed848b; $color-blue: #007ac5; $color-yellow: #fff2cb; $color-orange: #f8ad4e; //homepage---------------------------------- #homepage { span { font-weight: bold; } // .frame { // background-color: #FFFFFF; // border: solid 1px $color-pink; // padding: 4rem 5rem; // margin: 1.5rem 2rem 4rem 2rem; .frame { background-color: #FFFFFF; border: solid 1px $color-pink; margin: 1.5rem 2rem 5rem 2rem; display: flex; justify-content: center; align-items: center; dt { font-size: 18px; font-size: 1.8rem; text-indent: -1.3em; padding-left: 1.3em; &::before { font-family: "Font Awesome 5 Free"; content: "\f138"; padding-right: 5px; } } dd { padding-left: 2em; padding-bottom: 1rem; @include xs { font-size: 14px; font-size: 1.4rem; } } li { text-align: justify; text-indent: -1.2em; padding-left: 2.6em; line-height: 2.3rem; padding: 1rem; &::before { content: "・"; font-weight: 400; padding-right: 3px; } } } .inner { margin-top: 4rem; margin-bottom: 1rem; width: 87%; @include sm { margin-top: 2rem; margin-bottom: 0rem; width: 90% } } .link-list { li { padding: 0; padding-left: 1.2em; line-height: 2.3rem; } } .address { border-top: solid 1px #4d4d4d; border-bottom: solid 1px #4d4d4d; padding: 2rem; margin-bottom: 5rem; } }