@charset "UTF-8"; .is-sp{ display:none; } #footer{ padding:0; line-height:1; font-size:18px; letter-spacing:0; background:url(../img/a_bg02.png) repeat center top; } #footer a { text-decoration: underline; } #footer .box01{ padding:60px 0; } #footer .box01 .inner{ margin:0 auto; width:990px; } #footer .box02{ color:#fff; background-color:#fbaf8a; } #footer .box02 .inner{ margin:0 auto; width:990px; height:65px; position:relative; } #footer small{ font-size:13px; } #footer .title01{ letter-spacing:0.12em; color:#107283; } #footer .title02{ letter-spacing:0.1em; color:#107283; } #footer .title02 a{ color:#107283; } #footer .box01 a{ font-weight:bold; } #footer .link01{ display:inline-block; margin:15px 0; } #footer .link01 a{ padding:0 15px; color:#107283; border-right:1px solid #ccc; } #footer .box01 .link01 a{ letter-spacing:0.1em; } #footer .box01 .link01 a:first-child{ border-left:1px solid #ccc; } #footer .box01 .link01 a:last-child{ border-right:1px solid #ccc; } #footer .box02 .link01{ position:absolute; top:24px; right:0; margin:0; line-height:1; font-size:14px; } #footer .box02 .link01 a{ color:#fff; border-right:1px solid #fff; } #footer .box02 .link01 a:first-child{ border-left:1px solid #fff; } #footer .loginName{ } #footer .loginStatus{ display:inline-block; padding:0 15px; border-right:1px solid #ccc; } #footer .loginTool{ display:inline-block; padding:0 15px; } #footer .loginName a, #footer .loginStatus a, #footer .loginTool a{ color:#107283; font-weight:bold; } #footer p{ position:absolute; top:24px; left:14px; letter-spacing:0.1em; } /*** base ***/ body{ position:relative; min-width:990px; } img{ border:none; max-width:100%; height:auto; vertical-align:top; } /* スマホでリンクのタップのハイライトカラーを無効化 */ a{ -webkit-tap-highlight-color:rgba(0,0,0,0); tap-highlight-color:rgba(0,0,0,0); } .clear{ clear:both; } .cf:before, .cf:after{ content:" "; display:table; } .cf:after{ clear:both; } .cf{ *zoom:1; } /*** areaToppage ***/ #areaToppage{ display:none; position:fixed; bottom:0; right:0; margin-bottom:20px; width:60px; line-height:0; font-size:0; z-index:99999; } #areaToppage img{ width:100%; } #areaToppage .btn01{ width:60px; height:60px; margin:7px 0 0; } #areaToppage .btn02{ width:60px; height:60px; background-color:#fff; border-top-left-radius:10px; border-bottom-left-radius:10px; overflow:hidden; } #areaToppage .btn02-inner{ width:60px; height:225px; } #areaToppage .btn02 a{ display:block; } #areaToppage .btn02 .btn{ width:60px; height:60px; cursor:pointer; } #areaToppage .btn02 .sns01{ display:none; margin:4px auto 0; width:33px; } #areaToppage .btn02 .sns02{ display:none; margin:19px auto 0; width:33px; } #areaToppage .btn02 .sns03{ display:none; margin:19px auto 0; width:33px; } @font-face { font-family:"Yu Gothic M"; src:local("Yu Gothic Medium"); } @font-face { font-family:"Yu Gothic M"; src:local("Yu Gothic Bold"); font-weight:bold; } /*** wrapper ***/ .wrapper{ position:relative; font-family:-apple-system, BlinkMacSystemFont, "游ゴシック体", YuGothic, "Yu Gothic M", "游ゴシック Medium", "Yu Gothic Medium", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN W3", HiraKakuProN-W3, "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "MS Pゴシック", "MS PGothic", "Helvetica Neue", HelveticaNeue, Helvetica, Arial, "Segoe UI", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; background:url(../img/a_bg01.png) repeat center top; width:100%; min-width:990px; letter-spacing:0.12em; } .wrapper img{ width:100%; } /*** inner ***/ .inner{ width:100%; } h1{ margin:0; } /*** header ***/ #header{ position:absolute; top:0; left:0; right:0; width:100%; height:50px; background:#fbaf8a; z-index:999; } #header.top{ background:#fbaf8a; } #header a{ display:block; } #header .headerInner{ margin:0 auto; width:990px; height:50px; position:relative; } #header .text01{ position:absolute; top:14px; left:14px; width:236px; } #header .logo01{ position:absolute; top:5px; right:14px; width:92px; } /*** gnav-area ***/ #gnav-area{ position:absolute; bottom:0; left:0; right:0; width:100%; min-width:990px; height:90px; background-color:rgba(255,255,255,0.8); z-index:99; } #gnav-area.floating{ position:fixed; top:0; bottom:auto; background-color:rgba(255,255,255,0.9); } #gnav-area ul{ margin:0 auto; width:720px; height:90px; display:flex; position:relative; } #gnav-area ul::before{ display:block; position:absolute; left:0; top:26px; content:""; height:38px; width:1px; background-color:#b2b2b2; } #gnav-area ul li{ width:180px; height:90px; text-align:center; line-height:0; font-size:0; position:relative; transition:all 0.05s ease-out; } #gnav-area ul li::after{ display:block; position:absolute; right:0; top:26px; content:""; height:38px; width:1px; background-color:#b2b2b2; } #gnav-area ul li a{ transition:all 0.05s ease-out; } #gnav-area ul li a, #gnav-area ul li span{ display:block; padding:20px 0 0; width:180px; height:90px; } #gnav-area ul li span{ opacity:0.35; } #gnav-area ul li a img, #gnav-area ul li span img{ display:block; margin:0 auto; width:74px; } #gnav-area ul li.current::before{ display:block; position:absolute; bottom:0; left:0; right:0; content:""; height:5px; width:100%; background-color:#107283; } #gnav-area ul li.current a{ opacity:0.35; } /*** hover ***/ .hover01{ opacity:1; transition:all 0.05s ease-out; } .hover01:hover{ opacity:0.6; } .hover01.active:hover, .hover01.currnet:hover{ opacity:1; }