/*ゴシック体 font-family: 'Noto Sans JP', sans-serif; 明朝 font-family: 'Noto Serif JP', serif; */ body{margin:0;padding:0;color:#666;text-align:center;background:#fff;font-family:sans-serif;font-size:15px;line-height:170%;overflow: auto; overflow-x: hidden;} h1,h2,h3,h4,h5,h6,dd,div,dl,dt,p,ul,li{font-size:100%;line-height:170%} a {transition: all 0.5s;} a:hover {opacity: .5;} .sp64,.sponly48,.sp375 {display: none;} @media only screen and (max-width: 640px) {.sp64 {display: inline;}} @media only screen and (max-width: 480px) {.sponly48 {display: inline;}} @media only screen and (max-width: 375px) {.sp375 {display: inline;}} .cwrap {max-width: 1100px;margin: 0 auto;} @media only screen and (max-width: 1100px) {.cwrap {max-width: auto;margin: 0 3%;}} @media only screen and (max-width: 768px) {.cwrap {margin: 0 4%;}} /*米印リスト*/ ul.kome{margin:0;list-style-type:none;font-size:100%} ul.kome li{margin-left:-1em;text-indent:-1em;padding-left:2em;line-height:150%} ul.kome li:before{content:"※"} p.mnone {margin: 0;} /*-----長期休暇のお知らせ---------------*/ #information,#forminformation{margin:0 0 20px;padding:10px 15px;border:3px double #c0b485} #forminformation{margin:0} #information h3,#forminformation h3{font-size:120%;font-weight: bold;} #information2 {margin: 30px auto;padding: 10px 15px;text-align: left;background: #f2f2f2;} #information2 p{margin: 0} #information2 ul.kome{margin-top: 0.5em;font-size: 0.8rem;} #information2 ul.kome li{margin-bottom: 0.3em;} #information2.order-top {margin: 30px auto -15px auto;} @media only screen and (max-width: 1023px) { #information{margin:0 15px 30px} #forminformation{margin:0 15px} #information2 {margin: 30px 15px;} #information2.order-top {margin: 30px 15px -20px 15px;}} @media only screen and (max-width: 768px) { #information2.order-top {margin: 30px 15px;} } @media only screen and (max-width: 639px) { #information{margin:15px} #forminformation{margin:15px 15px 0 15px} #information2.order-top{margin:20px 15px 15px 15px} } /*------------ヘッダ---------------*/ #header{width:auto;height:5pc;background:url(../image/headback.gif) bottom repeat-x #6a6a6a;text-align:center;overflow: hidden;} #header a{color:#fff;text-decoration:none} #header .innerblock{position:relative;display:block;max-width:960px;width: 100%;height:5pc;margin:0 auto;overflow:hidden;} #header .shopname{display:block;float:left;padding:28px 180px 15px 0;font-size:22px;line-height:100%;background:url(../image/headlogo.gif)no-repeat;background-position:430px 18px;color:#fff;text-align:left} #header .shopname a{color:#fff;text-decoration:none;font-size:22px;font-weight:700} #header .shopname a:hover{color:#fff;text-decoration:underline;font-size:22px;font-weight:700} #header .telnumber{display:block;float:right;width:305px;padding:18px 12px 15px;font-size:22px;line-height:105%;color:#fff;text-align:right;} #header .telnumber .freetel{font-size:14px} #header .uketuke{display:block;margin:6px -7px 0 0;font-size:14px;line-height:110%} @media only screen and (max-width: 1024px) { #header{height:auto;} #header .innerblock{padding:15px 10px 0 10px;} #header .shopname{display:block;padding: 0 450px 10px 10px;background-position:60% 0;line-height:150%;color:#fff;text-align:left;white-space: nowrap} #header .shopname a{font-size:22px;font-weight:700} #header .telnumber{clear:left;display:block;float: none;width:auto;padding:0 15px 0 10px;font-size:150%;text-align:left} #header .uketuke{display:inline;margin:0;} } @media only screen and (max-width: 640px) { #header{height: 80px;padding:0;background: none;background:#322d26;} #header .innerblock{margin: 0;padding:10px 15px 0 10px;} #header .shopname{font-size:100%;line-height:100%;background: none;} #header .shopname a{padding:8px 0;color:#fff;text-decoration:none;font-size:112%;font-weight:700;line-height:150%} #header .shopname a:hover{font-size:112%} #header .shopname,#header .telnumber{padding:0;} #header .telnumber{font-size:120%;line-height:120%;} #header .telnumber .freetel{font-size:14px} #header .uketuke{display:block;font-size:65%;line-height:130%;} } /* --------NAVIGATION -----------------------*/ #toggle,#spmenu {display:none;opacity: 0;} #smmenu,.navbar,.spmenu{display:none;height:0} #sidr{display: block;width:100%;height:90px;text-align:center;background:url(../image/naviback2.png)repeat-x;border-bottom:1px solid #c9c9c9} #sidr ul{width:980px;height:90px;margin:0 auto} #sidr li{float:left;line-height:90px;font-size:105%;font-family:Noto Sans JP,游ゴシック体,sans-serif;font-weight:500} #sidr a{color:#333;font-size: 91%;text-decoration:none;font-weight: 300;letter-spaceing: 1px;} #sidr a:hover{background:url(../image/navi_o.png)} #sidr .on {font-size: 91%;} /*home*/ #sidr ul #home .on{background:url(../image/navi_on_01b.png);font-weight: 300; } #sidr ul #home .on,#sidr ul #home a{display:block;width:74px;height:90px} /*brand price*/ #sidr ul #brandprice .on{background:url(../image/navi_on_02b.png)}#sidr ul #brandprice .on,#sidr ul #brandprice a{display:block;width:5pc;height:90px} /*repair*/ #sidr ul #repair .on{background:url(../image/navi_on_03b.png)} #sidr ul #repair .on,#sidr ul #repair a{display:block;width:102px;height:90px} /*overhaul*/ #sidr ul #overhaul .on{background:url(../image/navi_on_04b.png)} #sidr ul #overhaul .on,#sidr ul #overhaul a{display:block;width:158px;height:90px} /*Polish*/ #sidr ul #polish .on{background:url(../image/navi_on_05b.png)}#sidr ul #polish .on,#sidr ul #polish a{display:block;width:78pt;height:90px} /*packing*/ #sidr ul #packing .on{background:url(../image/navi_on_06b.png)} #sidr ul #packing .on,#sidr ul #packing a{display:block;width:98px;height:90px} /*Question*/ #sidr ul #question .on{background:url(../image/navi_on_07b.png)} #sidr ul #question .on,#sidr ul #question a{display:block;width:76px;height:90px} /*お客様の声*/ #sidr ul #voice .on{background:url(../image/navi_on_08b.png)} #sidr ul #voice .on,#sidr ul #voice a{display:block;width:101px;height:90px} /*profile*/ #sidr ul #profile .on{background:url(../image/navi_on_09b.png)} #sidr ul #profile .on,#sidr ul #profile a{display:block;width:88px;height:90px} /*order*/ #sidr ul #order .on{background:url(../image/navi_on_10b.png)} #sidr ul #order .on,#sidr ul #order a{display:block;width:95px;height:90px} @media only screen and (max-width: 1024px) { /*PCメニューを非表示*/ #sidr{display:none;} /*SPメニューを表示(menu以外）*/ #smmenu{display:block;height:auto;background:#000;overflow:hidden} /* Hide checkbox */ #toggle {display: none;height: 0;margin: 0;padding: 0;} /*menu */ .navbar {position: absolute;top: 95px;left: 0;display: block;width: 21%;height:48px;line-height:48px;color: #fff;font-size:85%;z-index: 20000;transition: all 0.5s;} .spmenu {position: fixed;top: 0;left: -200px;display: block;width:200px;height: 100%;margin: 0;padding: 0;z-index: 1;transition: all 0.5s;background: #333;} /*toggle*/ label[for="toggle"] {cursor: pointer;display: block;} /*checkbox checked */ input#toggle:checked + .spmenu {left: 0;} input#toggle:checked ~ .content {left: 200px;} input#toggle:checked ~ .navbar {left: 200px;} .content {position: relative;left: 0; transition: all 0.5s;} /*menu / オーバーホールとは, / ブランド別価格表 / 修理依頼*/ .sbrandprice a,.sorder a,.soverhaul a {display:block;float:left;height:50px;color:#fff;border-right:1px solid #333;text-align:center;text-decoration:none;font-size:85%;line-height:50px;} .soverhaul a{width:36%;margin-left: 21%;} .sbrandprice a{width:19%} .sorder a{width:22%} /*クリック前のmenu #spmenu {position: absolute;width:21%;top: 95px;left: 0;display: block;height:50px;line-height:50px;font-size:90%;}*/ /* side menu */ .spmenu ul{display:block;margin:0 0 15px;padding:0;border-top:1px solid #1a1a1a;border-bottom:1px solid #4d4d4d;} .spmenu ul li{display:block;margin:0;line-height:48px;border-top:1px solid #4d4d4d;border-bottom:1px solid #1a1a1a} .spmenu ul li:hover, .spmenu ul li.active, .spmenu ul li .spmenu-class-active{border-top:none;line-height:49px;} .spmenu ul li:hover>a, .spmenu ul li:hover>span, .spmenu ul li.active>a, .spmenu ul li.active>span, .spmenu ul li .spmenu-class-active>a, .spmenu ul li .spmenu-class-active>span{-webkit-box-shadow:inset 0 0 15px 3px #222222;-moz-box-shadow:inset 0 0 15px 3px #222222;box-shadow:inset 0 0 15px 3px #222222;background: #333;} .spmenu li a, .spmenu li span{display: block;padding: 2px 10px;text-align: left;text-decoration:none;color:#fff} .spmenu ul li span.on{padding:20px;} /*BRAND MENU*/ #brandmenu,#brandmenutitle{display:none} /* drop down*/ /* link */ .mod_dropnavi ul li a{transition-property:border;transition-duration:.5s;transition-timing-function:ease;transition-delay:0} .mod_dropnavi ul li a:link {text-decoration:none;} .mod_dropnavi ul li a:visited {text-decoration:none;} .mod_dropnavi ul li a:hover {text-decoration:none;} .mod_dropnavi ul li a:active {text-decoration:none;} /* mod_dropnavi */ .mod_dropnavi>ul>li{float:none} .mod_dropnavi>ul>li>a{margin:0} /* mod_dropnavi_child */ .mod_dropnavi .mod_dropnavi_child{display:none;position:absolute;top:140px;left:50%;z-index:10} .mod_dropnavi .mod_dropnavi_child ul{padding:0!important;background:rgba(0,0,0,.6)} .mod_dropnavi .mod_dropnavi_child ul li{float:none;font-size:90%;line-height:0;text-align:left;white-space:nowrap} .mod_dropnavi .mod_dropnavi_child ul li a{float:none;padding:0 9pt!important;display:block;color:#fff;border:0} .mod_dropnavi .mod_dropnavi_child ul li a span{margin-left:1em;color:#ccc} .mod_dropnavi .mod_dropnavi_child ul li a:link {} .mod_dropnavi .mod_dropnavi_child ul li a:visited {} .mod_dropnavi .mod_dropnavi_child ul li a:hover {} .mod_dropnavi .mod_dropnavi_child ul li a:active {} } @media only screen and (max-width: 639px) { .mod_dropnavi .mod_dropnavi_child{top:95pt;left:25%;} .navbar {top: 82px;} } /*----PANKUZU-----------------------------------------*/ #pankuzu{width:980px;height:25px;margin:15px auto;background:#e6edf2} #pankuzu ul{overflow:hidden} #pankuzu ul li{float:left;height:25px;font-size: 12px;line-height:200%} #pankuzu ul li a{font-size:12px;line-height:100%;color:#333;text-decoration:none} #pankuzu ul li.home{padding: 0 20px 0 10px;margin:0;background:url(../image/home.png)no-repeat right #e6edf2} #pankuzu ul li.home2{padding: 0 20px 0 10px;margin:0;background:url(../image/home.png)no-repeat right #dbe3ea} #pankuzu ul li.home2 a:hover,#pankuzu ul li.home a:hover{color:#999;text-decoration:underline} #pankuzu ul li.txt{padding-left:10px;margin-right:10px} #pankuzu ul li.txt2{padding:0 10px 0 5px;background:url(../image/p.png)no-repeat right} @media only screen and (max-width: 1023px) { #pankuzu{width: calc(100% - 30px);} #pankuzu ul li,#pankuzu ul li a{font-size:10px;position:relative;top: 1px;} #pankuzu ul li.home a, #pankuzu ul li.home2 a{position:relative;top: 2px;}/*位置調整*/ } @media only screen and (max-width: 750px) { #pankuzu ul li{font-size: 9px;} } @media only screen and (max-width: 639px) { #pankuzu {display: none;} } /*----BRAND MENU------------------------------------------*/ #brandmenu{margin-bottom:30px;background:url(../image/brandbg_type1.png);font-size: 93%} #brandmenutitle{display:block;margin:0;padding:.3em 0;border-bottom:1px solid #e4e2e2;background:#e4e2e2;color:#62787b;font-size:85%;line-height:100%;} #brandmenutitle span{display:block;width:965px;margin:0 auto;font-size: 95%;text-align:left} #brandmenu ul{width:970px;margin:0 auto;padding:.2em 0;overflow:hidden;text-align:center} #brandmenu li{position:relative;float:left;display:block;padding:0;line-height:1em;white-space:nowrap} #brandmenu a{display:block;padding:.2em .5em;color:#666;font-size:82%;line-height:100%;text-decoration:none} #brandmenu a:hover{color:#999;background:#dce7e7} #brandmenu a span{margin-left:.8em;font-size:75%;line-height:1.8em;color:#62787b} #brandmenu a:hover span{color:#999} @media only screen and (max-width: 1023px) { #brandmenutitle,#brandmenu{display: none;} } /*----H1 / H2 / H3-----------------------*/ h1{height:65px;margin:0 0 20px;padding:0 0 0 20px;background:url(../image/h1back.gif)repeat-x;color: #000;font-size:22px;font-weight:700;line-height:300%} h2{margin:0 0 5px;padding:5px;font-size:18px;font-weight:700;line-height:150%;border-bottom:1px dotted #ccc} h3{margin:0 0 5px;font-size:18px;font-weight:700;line-height:150%} @media only screen and (max-width: 1023px) { h1{height: auto;margin:0 0 10px 0;padding: 12px 0 12px 8px;font-size:100%;line-height:150%;background:url(../image/h1back.gif)repeat-x bottom} } @media only screen and (max-width: 639px) {h1{margin:0 0 10px 0;}} /*----#headimg----------------------*/ #headimg{margin:0 0 30px} #headimg img{width: 100%;height: auto;line-height:0;} @media only screen and (max-width: 639px) {#headimg {margin:0 0 10px 0;}} /*----CONTAINER-----------------------*/ #container,.container,.httitlearea{max-width:980px;margin:0 auto;text-align:left;line-height:170%;} @media only screen and (max-width: 980px) { #container,.container{max-width:auto;margin:0 2%;} .httitlearea{max-width:auto;} } p{margin:0 0 15px;line-height:170%} /*----ブランド別下位置ボタン------------------------*/ #footbrandlink { padding:2%;border-top:1px dotted #f1eee7;border-bottom:1px dotted #cdc9bf; background: #f9f9f9; /* Old browsers */ background: -moz-linear-gradient(top, #f9f9f9 0%, #ffffff 30%, #ffffff 51%, #f9f9f9 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(top, #f9f9f9 0%,#ffffff 30%,#ffffff 51%,#f9f9f9 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to bottom, #f9f9f9 0%,#ffffff 30%,#ffffff 51%,#f9f9f9 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f9f9f9', endColorstr='#f9f9f9',GradientType=0 ); /* IE6-9 */ } #footbrandlink h3{width:auto;margin:0 0 20px;color:#878342;font-size:150%;font-family:ＭＳ\ Ｐ明朝,MS PMincho,ヒラギノ明朝 Pro W3,Hiragino Mincho Pro,serif;font-weight:400;text-align:center;} #footbrandlink ul{overflow:hidden} #footbrandlink ul li{float:left;width:30%;padding:1%;border-bottom:1px dotted #e5e5e5;line-height:130%;text-decoration:none} #footbrandlink ul li a{display:block;margin:0 1%;padding:0 1%;font-size:100%;font-family:ＭＳ\ Ｐ明朝,MS PMincho,ヒラギノ明朝 Pro W3,Hiragino Mincho Pro,serif;text-align:left;text-decoration:none;color:#8f865a;-webkit-transition:all .3s ease;-moz-transition:all .3s ease;-o-transition:all .3s ease;transition:all .3s ease} #footbrandlink ul li a .en{margin-left:1em;font-size:80%;font-family:ＭＳ\ Ｐ明朝,MS PMincho,ヒラギノ明朝 Pro W3,Hiragino Mincho Pro,serif;color:#878342} #footbrandlink ul li a:hover{background:#efecdb} @media screen and (max-width: 820px) { #footbrandlink ul li{float: left;width: 48%;} } @media screen and (max-width: 639px) { #footbrandlink h3{font-size:100%;} #footbrandlink ul {width: 100%;} #footbrandlink ul li{width:100%;padding:1%;line-height:130%} } /*フッタお支払い方法*/ #fhowtopayment {margin-bottom:25px;padding: 60px 0;background: #f2f2f2;border-top: 1px solid #ccc;border-bottom: 1px solid #ccc;text-align: center} #fhowtopayment.fhtpb {margin-bottom:0;border-bottom: 1px solid #ccc;} #fhowtopayment h3{display:flex;align-items:center;margin:0 5% 25px;font-size:160%;font-weight:400;font-family:YuMincho,Yu Mincho,Hiragino Mincho ProN,"serif";border: 0} #fhowtopayment h3:after,#fhowtopayment h3:before{border-top:1px solid #ccc;content:"";flex-grow:1}#fhowtopayment h3:before{margin-right:2rem} #fhowtopayment h3:after{margin-left:2rem} #fhowtopayment h4{margin:0 0 1em 0;font-size: 110%;font-weight:bold;line-height: 120%;} #fhowtopayment dl dt{font-weight: bold;color: #333399} #fhowtopayment dl{margin-bottom: 20px;} #fhowtopayment dl.last{margin-bottom: 0;} #fhowtopayment ul.kome {margin: 0 .3em;} #fhowtopayment ul.kome li{margin-left: -2em;padding-left: 2.5em;text-indent: -0.8em;line-height: 20px;} #fhowtopayment ul.kome li:before{content: "※ ";} #fhowtopayment .usecreditcard {margin: 0;} #fhowtopayment .usecreditcardshop img{margin: 12px 0;} #fhowtopayment .haisou{margin: 0 2% 1.5em;border-bottom: 1px solid #ccc;} #fhowtopayment .raiten{margin:0 2%} #fhowtopayment #chashlessblock {display: flex;margin-top: 15px;padding: 20px; border: 1px solid #cc0000;} #fhowtopayment .cashlesslogoimg img {width: 60px;height:auto;margin-right: 15px;} /*#footcontac*/ #footcontactarea {margin-bottom: 80px;padding: 50px 0;background: url("../image/footcontactus.png") no-repeat;background-size: cover;overflow: hidden;} #footcontactarea,#footcontactarea a {color: #fff;text-decoration: none} .footcontact {display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;} .footcontacttel {-ms-flex-preferred-size: 30%;flex-basis: 30%;} .footcontactmirumori,.kitorder {-ms-flex-preferred-size: 30%;flex-basis: 30%;} .footcontacttel,.footcontactmirumori{margin-right: 5%;} .footcontactmirumori,.kitorder {display: block;padding: 20px 0;border: 1px solid #fff;font-size: 120%;background: rgba(255,255,255,0);transition: all 0.5s;} .footcontactmirumori a,.kitorder a{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;width: 100%;margin: 0;padding: 20px 20px;line-height: 1;} .footcontactmirumori .icon img,.kitorder .icon img {width: 20px;height:auto;margin: 0 30px;} .footcontactmirumori .yajirusi img,.kitorder .yajirusi img {width: 30px;height:auto;margin-left: 30px;} .footcontactmirumori:hover,.kitorder:hover{background: rgba(255,255,255,0.48)} .fbtelnum {display: block;margin-bottom: 10px;font-size: 25px;letter-spacing: 0.05em;} .fbtelnum a{font-size: 40px;font-family: 'Noto Sans JP', sans-serif;font-weight: 300;} .fbtelnum i{margin-right: 10px;font-size: 40px;} /*#footer*/ #footer {padding: 0;background: #333;text-align: center;font-size: 14px;} #footer,#footer a {color: #fff;text-decoration: none;font-size: 14px;} /*受付カウンター*/ .footshopphotoarea {padding: 60px 0 40px 0} .fuketuke{display: block;margin-bottom: 50px;font-weight:400;font-family:YuMincho,Yu Mincho,Hiragino Mincho ProN,"serif";text-align: center;border: none } .fuketuke span{display: block;} .fuketuke .ja{font-size: 15px;} .fuketuke .en{position: relative;display: inline-block;margin-bottom: 1em;font-size: 20px;} .fuketuke .en:before{content:'';position:absolute;bottom:-15px;display:inline-block;width:60px;height:2px;left:50%;-webkit-transform:translateX(-50%);transform:translateX(-50%);background:#fff} .footshopphoto {display:-webkit-box;display:-ms-flexbox;display:flex;width: 100%;text-align: center} .footshopphoto p{flex-grow:1;} /*インフォメーションとリンク*/ #footinfoandlink {background: #000;color: #ccc;} #footinfoandlink a {color: #ccc;} /*wrap*/ .footlinksarea {padding: 80px 0;} /*社名*/ h3#footlogo {margin: 0 0 50px 5px;text-align: left;font-family:YuMincho,Yu Mincho,Hiragino Mincho ProN,"serif";border: none} h3#footlogo a{font-size: 20px;} #footinformation {display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack: justify;-ms-flex-pack: justify;justify-content: space-between;margin-bottom: 50px;text-align: left;} #footinformation dl{-ms-flex-preferred-size: 46%;flex-basis: 46%;margin-bottom: 1em;} #footinformation dt {display: block;padding: 0 10px 10px 10px;font-ize: 120%;font-weight:bold;letter-spacing: 0.05em; border-bottom: 1px solid #444444;border-bottom: 1px solid #444444;} #footinformation dd {display: block;padding: 10px;} .footaress,.footetel,.uketukejikan,.footer-raiten-attention {display: block;} .footer-raiten-attention {margin-top: 0.5em;font-size: 0.8rem;color: #999999} .fbtitle {font-size: 120%;margin-bottom: 20px;padding-bottom: 10px;font-family:YuMincho,Yu Mincho,Hiragino Mincho ProN,"serif";letter-spacing: 0.05em;border-bottom: 1px solid #444444;} #footbrandcpace,#foototherlink {margin-bottom: 60px;} #footbrandcpace,#foototherlink ul {display:-webkit-box;display:-ms-flexbox;display:flex;text-align: left;} #footbrandcpace ul,#foototherlink ul {padding: 0 10px;} #footbrandcpace ul{-ms-flex-preferred-size: 25%;flex-basis: 25%;} #foototherlink ul{ms-flex-wrap: wrap;flex-wrap: wrap;} #footbrandcpace li,#foototherlink li{margin: 2px 0;padding: 3px 0;} #foototherlink li{-ms-flex-preferred-size: 25%;flex-basis: 25%;} /*#page-top*/ #page-top{position:fixed;bottom:10px;right:20px;font-size:150%} #page-top a{display:block;background:rgba(0,0,0,.35);text-decoration:none;color:#fff;width:50px;height:50px;line-height:50px;text-align:center} #page-top a:hover{text-decoration:none;color:#ccc;background:hsla(0,0%,92%,.3)} @media only screen and (max-width: 980px) { #footcontactarea {margin-bottom: 50px;padding: 30px 0;} .footcontact {-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-direction: column;flex-direction: column;width: auto;} .footcontacttel,.footcontactmirumori,.kitorder {width: 100%;} .footcontacttel,.footcontactmirumori{margin-right: 0%;margin-bottom: 20px;} .footcontactmirumori,.kitorder {-ms-flex-preferred-size: 100%;flex-basis: 100%;padding: 10px 0;} .footcontactmirumori a,.kitorder a{padding: 10px;} } @media only screen and (max-width: 768px) { h3#footlogo {margin: 0 0 50px 8px;} #footinformation {display: block;} #footbrandcpace {-ms-flex-wrap: wrap;flex-wrap: wrap;} #footbrandcpace ul,#foototherlink li{-ms-flex-preferred-size: 47%;flex-basis: 47%;padding: 0} } @media only screen and (max-width: 640px) { #footer {padding: 30px 0 0 0;} /*受付カウンター*/ .footshopphotoarea {padding: 20px 0 30px 0} .fuketuke {padding-bottom: 30px;} .footshopphoto {display:block;} .footshopphoto p:first-child{margin-bottom: 1em;} } @media only screen and (max-width: 480px) { #footbrandcpace ul,#foototherlink li{-ms-flex-preferred-size: 100%;flex-basis: 100%;padding: 0}.fbtelnum a{font-size: 35px;} } .footlinksarea #footbrandcpace{position: relative; top: 0; left: 0; overflow: hidden; } .footlinksarea #footbrandcpace ul {margin: 0;clear: both;} #footer .footlinksarea a{line-height: 0;} .footlinksarea p.tac{margin: 0;text-align: center;} #footcontactarea .footcontacttel, #footcontactarea .footcontactmirumori, #footcontactarea .kitorder{margin-bottom: 0;} @media only screen and (max-width: 640px){#footbrandcpace{height: auto;} .ofh{overflow: hidden;}} #footcontactarea .footcontacttel{text-align: center;} #page-top{z-index: 10;} #page-top a{position: relative;} #page-top a span{position: absolute;left: 19px;top: 4px;} .fbtelnum a{position: relative;} .tel_w{width: 32px;position: absolute;top: 10px;left: -30px;} @media only screen and (max-width: 639px) { .fbtelnum a{font-size: 32px;position: static;} .tel_w{width: 25px;position: static;} } .copyright {padding: 18px;color: #fff;background: #333;font-size: 14px;} /* この記事では、以下のことについて解説しています --------------------------------------------------------*/ .article-red{color:#d10808} .article-headline{margin:40px auto;border:2px solid #9e9545;padding:5px;max-width:530px;min-width:20pc} .article-headline-label{background:#9e9545;padding:5px;color:#fff;width:auto;font-size:18px} .article-headline-link-wrapper{margin:40px 0} .article-headline img{margin-bottom:-3px;margin-right:5px} .article-headline-link{cursor:pointer;color:#333;text-decoration:none} .article-headline-link img{margin-right:5px} .article-headline-link p{margin:10px 0 0 25px;font-size:1pc} .article-headline-link p:hover{color:#7c7c7c} .article-headline-simple-wrapper{width:80%;max-width:50pc;margin:50px auto 150px} .article-headline-simple-label{font-size:22px;text-align:center;border-bottom:2px gray solid;padding-bottom:20px;color:#000} .article-headline-simple-text{cursor:pointer;font-size:18px;color:#3f3e3e;display:block;line-height:2.4em;text-decoration:none} .article-headline-simple-text:hover{text-decoration:underline;color:gray} h3{margin:0 0 5px;padding:5px;font-size:18px;font-weight:700;line-height:150%;border-bottom:1px dotted #ccc} @media only screen and (max-width:550px){ .article-headline-label{font-size:9pt} .article-headline-link p{margin:10px 0 0 15px;font-size:14px} .article-headline-simple-wrapper{margin:50px auto 75px} } @media only screen and (max-width:340px){ .article-headline-label{width:280px;font-size:11px} .article-headline{min-width:280px} } /* この記事の監修 --------------------------------------------------------*/ .supervisor-wrapper{display:flex;padding:20px;margin:40px auto;justify-content:center;border:1px solid #dadada;border-radius:5px;max-width:900px;width:80%;align-items:center} .supervisor-icon{width:145px;height:145px;margin:0 40px 0 0} .supervisor-text{text-align:left;font-size:14px} .supervisor-icon img{width:100%;border-radius:50%} .supervisor-label{width:90pt;text-align:center;padding:3px 20px;background:#565656;color:#fff} .mt-20{margin-top:20px;line-height:1rem} .supervisor-name{color:#4076af;font-size:1.4rem;line-height:1rem;margin-top:8px} /*基本料金改定のお知らせ　モーダルウインドウ --------------------------------------------------------*/ .price-revision {max-width: 1025px;margin: -10px auto 30px auto;} @media only screen and (max-width: 1025px) {.price-revision {max-width: auto;margin: 0 8px 30px 8px}} dialog {width: 80%;color: #333;background: #fff;border: 0;border-radius: 10px;opacity: 0;transition: opacity .5s ease-in-out; &::backdrop { background: rgba(0, 0, 0, 0);transition: background .5s ease-in-out;} &.show {opacity: 1; &::backdrop {background: rgba(0, 0, 0, 0.8);} } .dialog-inner {padding: 0 20px 10px;text-align: left;} } h3.dialog-inner-title {display:block;margin-bottom :20px;text-align: center;} button.dialog-open {position: relative;width: 100%;padding: 10px 30px;background:#c0b485;border: none;color: #fff;font-size: 16px;font-weight: bold;cursor: pointer;transition: all .5s;} button.dialog-open:hover{background: #333;color: #fff;} button.dialog-open i{position: absolute; top: 15px;right: 20px;transition: all 0.5s;} button.dialog-open:hover i{right: 15px;} .dialog-close-area {margin: 0;text-align: center;} button.dialog-close {padding: 5px 20px;background: #fff;border: #333 3px solid;color: #333;font-size: 12px;cursor: pointer;transition: all .3s;} button.dialog-close:hover {background: #333;color: #fff;}