@charset "utf-8"; /* =================================================== scrolltop =================================================== */ #scrolltop { margin-top: 50px auto 0; a { font-family: @font02; &::after { top: 70%; border-top: 2px solid @colorSub; border-right: 2px solid @colorSub; } font-size: 120%; } } /* =========================================================================================== FOOTER =========================================================================================== */ footer { position: relative; background: @colorMain; color: #FFF; /* =================================================== レイアウトfooterLay01の場合 =================================================== */ &.footerLay01 { .footerContainer{ display: table; .logoArea, .footerInfo, .snsIcon{ display: table-cell; vertical-align: middle; } } .logoArea { width:300px; 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 { background: url(../images/bg_fnav_line.jpg) repeat-x bottom center; ul { display: flex; flex-wrap: wrap; width: @contentWidth; margin: 0 auto; font-size: 14px; padding: 15px 0; li { width : calc(100% / 6); padding: 5px 10px; text-align: center; a { width: 100%; color: #FFF; } } } } /* footerNavi END */ /* =================================================== Footer共通 =================================================== */ .footerContainer { color: #FFF; width: @contentWidth; padding: 60px 0 40px; 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; p { width: @contentWidth; color: #FFF; margin: 0 auto; text-align: center; } } }