@charset "utf-8"; /* =================================================== scrolltop =================================================== */ #scrolltop { margin-top: 50px auto 0; a { &::after { top: 60%; border-top: 2px solid @colorSub; border-right: 2px solid @colorSub; } font-size: 110%; } } /* =========================================================================================== FOOTER =========================================================================================== */ footer { padding-top: 15px; position: relative; background-color: @colorMain; background-image: url(../images/bg_footer.jpg); background-repeat: repeat-x; background-position: top center; /* =================================================== レイアウトfooterLay01の場合 =================================================== */ &.footerLay01 { .footerContainer{ display: table; .logoArea, .footerInfo, .snsIcon{ display: table-cell; vertical-align: middle; } } .logoArea { width: 250px; padding-right: 20px; } .snsIcon { ul { text-align: right; } } } /* =================================================== レイアウトfooterLay02の場合 =================================================== */ &.footerLay02 { .footerInfo, .logoArea, .snsIcon { width: 100%; display: inline-block; margin: 0 0 15px; text-align: center; } .logoArea { a { width: 20%; display: inline-block; } } .snsIcon { margin: 0; ul { text-align: center; } } } /* =================================================== Footerグローバルナビ =================================================== */ .footerNavi { border-bottom: 1px dotted #9cbaff; ul { width: @contentWidth; margin: 0 auto; font-size: 14px; padding: 15px 0; text-align: center; li { display: inline-block; padding: 5px 15px; text-align: center; a { width: 100%; color: #FFF; } } } } /* footerNavi END */ /* =================================================== Footer共通 =================================================== */ .footerContainer { color: #FFF; width: @contentWidth; padding: 40px 0; margin: 0 auto; .clearfix(); /* -------------------------------------------- インフォメーション部分 -------------------------------------------- */ .footerInfo { font-size: 14px; h2 { font-weight: bold; line-height: 130%; background: none; padding: 0; } h3 { font-weight: normal; line-height: 130%; border: none; padding: 0; &::after { content: none; } } .telNum { line-height: 100%; &:before { font-family: Flaticon; content: '\e0a9'; margin: 0 5px 0 0; } } // .add, // .businessHours { // } } /* -------------------------------------------- SNSアイコン部分 -------------------------------------------- */ .snsIcon { ul { margin: 0 auto; li { box-sizing: content-box; display: inline-block; width: 40px; /*要変更*/ height: 40px; /*要変更*/ padding: 0 5px; } li a { display: block; text-align: center; border-radius: 3px; &:hover { opacity: 0.7; } } li img { width: 40px; /*要変更*/ height: 40px; /*要変更*/ margin: 0; } } } } /* footerContainer END */ /* =================================================== Copyright共通 =================================================== */ .copyright { font-size: 12px; padding: 10px 0; background: #53A2E5; p { width: @contentWidth; color: #FFF; margin: 0 auto; text-align: center; } } }