@charset "utf-8";  /* † */

::selection{ color:HighlightText; background:Highlight; text-shadow:none;}
::-webkit-selection{ color:HighlightText; background:Highlight; text-shadow:none;}
::-moz-selection { color:HighlightText; background:Highlight; text-shadow:none;}

/* Chro */ @media screen and (-webkit-min-device-pixel-ratio:0) { h1,h2,h3,h4,h5,p,dt,dd,ul,ol,li,th,td,blockquote { max-height: 100%;}}
section, nav, article, aside, hgroup,header, footer, figure, figcaption, details { display: block;}
video, audio, canvas { display: inline-block;
 *display: inline;
 *zoom: 1;}


html{ overflow-x: hidden; font-size:16px; -webkit-text-size-adjust: 100%;}
body { font-family: 'Lucida Grande', "メイリオ", Meiryo, -apple-system , Segoe UI , "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka,"ＭＳ Ｐゴシック", sans-serif;
font-size:16px; font-size:1rem; color: #333; line-height: 1.6;
 -moz-osx-font-smoothing: grayscale;
 -webkit-font-smoothing: antialiased; /* アンチエイリアスON */
}
html,body,h1,h2,h3,h4,p,ul,ol,li,dl,dt,dd
	{ margin: 0; padding: 0;}
h1, dt, .t-shadow
	{ text-shadow: 1px 2px 2px #BBB;}
img , iframe{ border-style: none;  -ms-interpolation-mode: bicubic;}
svg:not(:root) { overflow: hidden;}
*, ::after, ::before
	{ box-sizing: border-box;}
p{ margin: 6px;}

a { color: blue; text-decoration:none;}
a:focus, a:hover, a:active
	{ color: red;}
a:hover, a:active, a:visited, *:visited, *:active, .active, a.container-text
	{ outline:none;}


body{ background: #FF9 url(img/bk.jpg) repeat-x;}
#wrapper{ width: 960px; margin: 0 auto; padding-bottom: 6px; background: white url(img/setting.jpg) no-repeat; border: solid #FFBEDA; border-width: 0 4px;}
.header{ background: url(img/light.jpg) no-repeat 100% 0; text-align: center;}

h1{ font-size: 24px; margin:0; padding: 6px 0 24px; background: rgba(0, 0, 0, 0) url("img/tel2.gif") no-repeat 80% 86%;}
h1,h2,#company{ letter-spacing: .1em;}
#company{ padding-top: 2px; font: bold 116px/1 'HGP創英角ﾎﾟｯﾌﾟ体','HG創英角ﾎﾟｯﾌﾟ体','HGS創英角ﾎﾟｯﾌﾟ体','HGP創英角ｺﾞｼｯｸUB','HG創英角ｺﾞｼｯｸUB','HGS創英角ｺﾞｼｯｸUB','江戸勘亭流Ｐ','ヒラギノ角ゴ Std W8','Hiragino Kaku Gothic Std',sans-serif; text-shadow: 2px 4px 6px gray; -webkit-text-stroke-width: 4px;}
.t1{ color:#FF82EE;}
.t2{ color:#FF3; padding: 0 0.4em;}
.t3{ color:#00F;}
h2{ margin: 0; font-size: 125%; color: red;}

ul.lineup{ width: 100%; letter-spacing: -0.4em;}
ul.lineup li{ display: inline-block; width: 20%; vertical-align: top; letter-spacing: normal; background: no-repeat 50% 0;}
ul.lineup li.TOILE{ background-image: url(img/lineup_01.jpg);}
ul.lineup li.STOVE{ background-image: url(img/lineup_02.jpg);}
ul.lineup li.TV{ background-image: url(img/lineup_03.jpg);}
ul.lineup li.AC{ background-image: url(img/lineup_04.jpg);}
ul.lineup li.WASH{ background-image: url(img/lineup_05.jpg);}
ul.lineup li a:before{ content:""; display: block; padding-top: 106px;}

ul.lineup li.TV a:before{ background: url(img/cm.gif) no-repeat 50% 46%;}
p.addr{ text-align: right; margin:0; padding: 14px 16px 6px 0; font-size:18px;}
.addr big{ font-weight: bold; font-size:132%; color: #005; white-space: nowrap;}


ul.lineup2{ width: 100%; letter-spacing: -0.4em;}/* liのinline-blockを横並びで段落ちさせないletter-spacing: */
ul.lineup2 li{ display: inline-block; vertical-align: top; letter-spacing: normal;}
ul.lineup2 li.TOILE{ width: 17.88%;}
ul.lineup2 li.STOVE{ width: 20.53%;}
ul.lineup2 li.TV{ width: 19.536%;}
ul.lineup2 li.AC{ width: 20.198%;}
ul.lineup2 li.WASH{ width: 21.854%;}
ul.lineup2 li a{ display: block;}
ul.lineup2 li a img{ display: block; margin:0 auto;}
ul.lineup2 li.TV a img.tv_2{ background: url(img/lineup_03.jpg) 0 0 /contain no-repeat;}


div#main{ padding: 8px 0;}
div#main > div{ padding: 8px 14px 8px 20px;}
div.sec-011{ border: solid #FF82EE; border-width: 1px 0; background-color: #FFFAFA;}

div.A50 , div.B50
	{ width: 49%;  box-shadow: 2px 4px 8px #DCDCDC;}
div.A50{ float:left; margin: 8px 4px 8px 0;}
div.B50{ float:right; margin: 8px 0 8px;}

h3{ padding: 12px 0 0 8px; color: #B22222;}
#main dl{ padding: 2px 4px 12px;}
#main dt{ float: left; width: 15em; max-width: 260px; padding: 13px 0 0 32px; background: url(img/bklight.gif) no-repeat 3px 12px; clear: both;}
#main dd.tx_ind1{ text-indent: -0.5em;}
#main dd.tx_ind2{ text-indent: 0.9em;}
#main dd{ padding-top: 14px; border-bottom: 1px dashed silver;}
#main small{ color: gray;}

.main2 p{ margin: 10px 0; padding: 0 30px;}

.main3{ background: url(img/sapporo.gif) no-repeat 98% 90%; font-size: 88%;}
.main3 > ul{ width: 720px; list-style:none;}
.main3 > ul > li{ padding: 6px 0;}
.main3 ul ul{ display: inline; padding-right: 6px;}

div#main div.trouble{ padding: 20px 8px 6px 320px; min-height: 280px; background: url(img/trouble.jpg) 0 0 no-repeat; background-size: contain;}
div#main div.trouble ul{ min-height: 220px; background: url(img/trouble_02.jpg) 100% 0 no-repeat; background-size: contain;}

/* list-check */
ul.list-check{ margin: 0 0 14px 0; padding-left: 40px; font-size: 18px;}
ul.list-check li{ padding-bottom: 14px; list-style-image: url(img/parts/check-mark.gif);}
ul.list-check li ul{ padding: 4px 4px 4px 16px; font-size: 16px;}
ul.list-check li ul.dsin-li{ padding-left: 0px;}
ul.list-check li ul li{ padding-bottom: 4px; list-style-image: none;}

ul.list-check li span{ padding: 0 14px 0 4px; background: url(img/underline.gif) repeat-x 0 100%; color: black;}

/* viewer */
#viewer{ margin: 0 auto; width: 100%; max-width: 900px; overflow: hidden; position: relative; background: url(img/fee_karrow.gif) 0 0 /contain no-repeat;}
#viewer:before{ content:""; display: block; padding-top: 26.66666%; /* H/W=% */}
/* IE7 */ *:first-child+html #viewer{ height: 240px;}
/* IE6 */ * html #viewer{ height: auto !important; height: 240px;}
#viewer img{ position: absolute; top: 0; left: 0; bottom: 0; right: 0; width:100%; height:auto;}


.footer{ padding: 6px 200px 0px 8px; text-align: center; background: url(img/digital.gif) no-repeat 98% 100%;}
span.mobile{ display: inline-block; padding-left:142px; background: url(img/mobile.gif) no-repeat 0 50%;}
span.mobile img{ vertical-align:middle;}
.footer span.mobile{ margin-left:100px;}

#copy{ margin: 0; padding: 20px 0 32px; font-size: 88%; text-align: center; background: url(img/tool.jpg) no-repeat 50% 100%;}
em,address{ font-style: normal;}
small{ font-weight: normal;}


 /* ▲▲▲▲▲ min 481px */
@media only screen and (min-width: 481px) {
.carousel-control-prev{ left: -11%;}
.carousel-control-next{ right: -11%;}
.carousel-control-next, .carousel-control-prev{ font-size:2em;}
} /* END ▲min 481px */
 /* ▲▲▲▲▲ min 576px */
@media only screen and (min-width: 576px) {

} /* END ▲min 576px */
 /* ▲▲▲▲▲ min 681px */
@media only screen and (min-width: 681px) {
.container-3{ padding-left: 6px;}
.container-3 .news-3{ float: left; width: 50%;}
.container-3 .news-3 dl{ padding-right:10px;}
.container-3 #facebook_Plugin{ float: right; width: 50%;}
} /* END ▲min 681px */
 /* ▲▲▲▲▲ min 768px */
@media only screen and (min-width: 768px) {
.section { padding: 48px 0;}
.sec1-plan{ float:left; width:50%;}
.sec2-plan{ float:right; width:50%;}
.container-2 p img.flef{ margin-right: 20px;}
} /* END ▲min 768px */
 /* ▲▲▲▲▲ min 992px */
@media only screen and (min-width: 992px) {
.container-2{ max-width: 960px;}
#wrapper #privacy p.minw992-spaceL{ padding: 60px 0 40px 300px !important; clear:both;}
#wrapper #privacy p.minw992-spaceR{ padding: 20px 340px 20px 30px !important;}
#wrapper .footer address{ background-position: 2px 0;}
} /* END ▲min 992px */

 /* ▼▼▼▼▼max 991px */
@media only screen and (max-width: 991px){
#wrapper{ width: 100%; border:none; background-size: 30%;}

} /* END ●991px */
 /* ▼▼▼▼▼max 896px iPhone */
@media only screen and (max-width: 896px){ 

} /* END ●896px */
 /* ▼▼▼▼▼max 767px */
@media only screen and (max-width: 767px){ 
#wrapper{ background-size: 30%;}
h1{ font-size: 20px; padding: 0 8px 16px; background-position: 70% 96%;}
h1,h2,#company{ letter-spacing: normal;}
#company{ font-size: 80px;}
.t2{ padding: 0 0.1em;}
h2{ padding: 0 8px; font-size: 20px;}

div#main > div{ padding: 6px 8px 6px 8px;}
div#main div.trouble ul{ min-height: auto; background: none;}
p.addr{ text-align: right; margin:0; padding: 14px 16px 6px 0; font-size:18px;}
.addr big{ font-weight: bold; font-size:132%; color: #005;}
div.A50 , div.B50
	{ box-shadow: 2px 3px 4px #DCDCDC;}
#main dt{ float: left; width: 13em; max-width: 240px; padding: 10px 0 0 28px;}
#main dd{ padding-top: 12px;}

.main2 p{ padding: 0 12px;}
div#main .main3{ padding: 6px 12px; background-image:none;}
.main3 > ul{ width: auto;}
.main3 > ul > li{ padding: 4px 0;}
.main3 ul ul{ padding-right: 4px;}

.footer{ padding-right: 6px; text-align: center; background: none;}
.footer span.mobile{ margin-left:0;}

a[href^="tel"] { text-decoration: none; color: inherit;}
a[href^="tel:01"] { text-decoration: underline; color: #1E90FF;}

.container-2{ padding-right: 15px; padding-left: 15px;}
.container-2 p img.flef{ float:none;}

} /* END ●767px */
 /* ▼▼▼▼▼max 680px */
@media only screen and (max-width: 680px){ 
div.A50 , div.B50
	{ width: auto; float:none; margin-right:0;}
div#main > div{ padding: 6px 0;}
div#main div.trouble{ padding: 6px 8px 6px 240px; background-position: -56px;}

#main dt{ width: 15em; max-width: 260px; padding: 10px 0 0 32px;}
br.nobr{ display:none;}
} /* END ●680px */
 /* ▼▼▼▼▼max 575px */
@media only screen and (max-width: 575px){ 
ul.lineup li{ margin-top: 10px; width: 33%; background-size:contain; font-size: 15px;}
ul.lineup li a:before{ padding-top: 84%; /* H/W=% */}
ul.lineup2 li{ font-size: 15px;}
ul.lineup2 li:first-child{ font-size: 14px;}
.container{ padding-left:8px; padding-right:8px;}
#main dt{ width: 13em; max-width: 240px; padding: 10px 0 0 28px;}

} /* END ●575px */
 /* ▼▼▼▼▼max 480px */
@media only screen and (max-width: 480px){ 
h1{ background-position: 80% 96%;}
.container-2{ padding-left:8px; padding-right:8px;}
div#main div.trouble{ padding: 6px 0; min-height:auto; background: none;}
ul.lineup2 li{ margin-top: 10px;}
ul.lineup2 li.TOILE{ width: 30.857%;}
ul.lineup2 li.STOVE{ width: 35.428%;}
ul.lineup2 li.TV{ width: 33.714%;}
ul.lineup2 li.AC{ width: 33%; margin-right:26px;}
ul.lineup2 li.WASH{ width: 35.7%;}
#wrapper address span.ltd{ font-size:1.4em;}
#wrapper address{ padding-left: 12px;}
#wrapper address span{ display: block;}
#wrapper address span.ltd{ padding-left: 98px; min-height: 50px;}
#wrapper address span.addr{ padding-left: 0;}
#wrapper p#copy{ padding:16px 6px 20px; font-size:10px;}

} /* END ●480px */

 /* ▼▼▼▼▼max 340px */
@media only screen and (max-width: 340px){ 

} /* END ●340px */

table{ border-collapse: collapse; font-size:inherit;}
 /* IE6 */ * html table{ line-height:1.6;}
table , th , td{ padding: 6px 8px; border: 1px solid #D3D3D3;}
table caption{ font-size:24px; color: navy; text-align: left;}
table th{ color: black;}
table td{ background-color: white;}

ul.dsin-li li , ol.dsin-li li , table.fee li
	{ display: inline-block; padding-left: 10px;}
ul.dsin-li li:before , table.fee li:before
	{ content: '\30FB ';}/* Unicode 黒丸 */
ol.dsin-li li{ counter-increment: aaaa;}
ol.dsin-li li:before{ content: counter(aaaa) ".  "; font-size: 18px; font-weight: bold;}

img{ vertical-align: top; max-width:100%; height:auto;}

/* shadow */
div#form table , .shadow
	{ border-radius: 10px; box-shadow: 2px 5px 8px silver;}
.list-mark , .no-li
	{ list-style: none;}
.space1{ letter-spacing: 0.5em;}

.frig{ float: right;}
.cl{ clear: both;} /* IE6 */ * html br.cl{ letter-spacing:0;}
.cen{ text-align: center;}
.lef{ text-align: left;}
.rig{ text-align: right;}
.vm{ vertical-align: middle;}
.text-in-1{ text-indent: 1em;}
.text-in-12{ text-indent: .5em;}
.ma0{ margin: 0 !important;}
.mat0{ margin-top: 0 !important;}
.mab0{ margin-bottom: 0 !important;}
.mab05{ margin-bottom: 0.5em;}
.pa0{ padding: 0 !important;}
.space-t{ padding-top: 16px !important;}
.space-t0{ padding-top: 0 !important;}
.space-b{ padding-bottom: 16px !important;}
.space-l{ padding-left: 16px !important;}
.space-l2{ padding-left: 40px !important;}
.dsbl{ display: block;}
.dsin{ display: inline;}
.no-bk{ background: none !important;}
.no-bor{ border: none !important;}
.bk-dot_1 p{ padding-left: 12px; background: url(img/bk-dot.gif) repeat-y;}
.bt-line2{ background: url(img/bt-line2.gif) repeat-x 0 100%;}
.bt-line3{ background: url(img/bt-line3.gif) no-repeat 0 100%;}
#mobile-carrier li , .break-all
	{ word-break: break-all;}
span.line{ padding: 0 4px; background: url(img/underline.gif) repeat-x 0 100%;}

.line-top_b01{ padding-top: 32px; background: url(img/line-blue-gra2.jpg) no-repeat 0 16px;}
.line-bottom_b01{ padding-bottom: 16px; margin-bottom: 16px; background: url(img/line-blue-gra2.jpg) no-repeat 0 100%;}

/* ページリンク　着地点 */
a[href^="form"] { display: inline-block; padding-left: 1em;}
.free-tel .tel-link:before , a[href^="tel:0120"]:before 
	{ content: url(img/free-tel1.gif) " ";}
.free-tel .tel-link a[href^="tel:0120"]:before{ content: none;}

span.tel-link{ font-size: 20px; color: black;}
span.tel-link:before{ content: "TEL "; font-size: 14px; color: gray; font-weight:normal; text-shadow:none;}

/* clearfix */
.clearfix:after {
content: ".";
display: block;
clear: both;
height: 0;
visibility: hidden;
}
.clearfix {
min-height: 1px;
}
* html .clearfix {
height: 1px;
/*\*//*/
height: auto;
overflow: hidden;
/**/
}


hr { border: 1px solid silver;}
.cowh{ color: white;}
.cor{ color: #DC143C;}
.cobl{ color: #000;}
.coblu{ color: #0000CD;}
.conv{ color: navy;}
.cogre{ color: #006400;}
.cogr{ color: gray;}
.coma{ color: maroon;}
.bk-green{ padding: 4px 0 0 8px; background-color:#CFC;}
.bk-gra{ padding: 6px 0 4px 8px; background: #CFC url(img/line-gra.jpg) no-repeat; background-size:100% 100px; color:black; text-shadow: 1px 2px 2px silver;}
.container-2 h3.bk-gra , .container-2 h4.bk-gra , .bk-gra-blu
	{ margin: 20px 0 14px -18px; padding:12px 0 8px 12px; min-height: auto; background: #CFC url(img/line-gra.jpg) no-repeat; background-size:100% 100px; color:black; text-shadow: 1px 2px 2px silver;}

.bk-blue{ padding: 4px 0 0 8px; background-color:#39F; color:white;}

.nowrap, strong{ display: inline-block;}
.nowrap2, .tel-link{ white-space: nowrap;}

em, dfn , address { font-style: normal;}
.fob{ font-weight: bold;}
.thin{ font-weight: normal !important;}
.li2{ line-height: 2;}
.li_s{ line-height: 1.2;}
small,.fo11{ font-weight: normal; font-size: 85%;}
/* IE7 */ *:first-child+html .zoom{ letter-spacing: 0;}

.fo10 { font-size: 10px;}
.fo20-18 { font-size: 90% !important;}
.fo100 { font-size: 100% !important;}
.fo108 { font-size: 108% !important;}
.fo14 { font-size: 108%;}
.fo15, big{ font-size: 116%;}
.fo16 { font-size: 123.1%;}
.fo18 { font-size: 138.5%;}
.fo20 { font-size: 153.9%;}
.fo24 { font-size: 24px;}
.fo30 { font-size: 30px;}

