@charset "utf-8";

html {
  -ms-touch-action: manipulation;
  touch-action: manipulation;
}
img{backface-visibility: hidden;-webkit-backface-visibility: hidden;}

/*ページ幅指定*/
#wrap{width: 100%;margin: auto;}
.content{min-height:600px;}

.section-inner{max-width: 1200px;margin: auto;padding: 20px 0;}

.box{margin-bottom: 30px;}
.onlypc-inline{display: inline-block;}
@media screen and (max-width:1400px){
.content-inner{padding: 40px 20px;}
}
@media screen and (max-width:1200px){
#wrap{min-width:100%;}
}
@media screen and (max-width:900px){
.section-inner{padding: 10px;}
}
@media screen and (max-width:640px){

.btn{white-space:normal;line-height: 1.2;}
}

.main.right,
.main.left{width: 75%;}
.side.left,
.side.right{width: 23%;}


@media screen and (max-width:900px){
.main.right,
.main.left,
.side.left,
.side.right{width: 100%;}

.main{margin-bottom: 40px;}
.side .banner{margin-bottom: 20px;}
}

.result-header{text-align: center;position: relative;}
.result-text{position: absolute;right: 0;bottom: 20px;}

.pagination i{margin:0 5px;}
@media screen and (max-width:900px){
.pagination{padding: 0 10px;}
.pagination i{margin:0;}
}
@media screen and (max-width:640px){
.result-total{display: block;width: 100%;padding-top: 10px;}
.result-total .num{line-height: 1;}
.pagination{margin-top: 10px;float: left;}

}

.pt20{padding-top: 20px;}


/* 　text
******************************************/
body{color: #14284c;position: relative;}
p{margin-bottom: 11px;}
strong{font-weight: bold;color: rgb(0,49,90);}
strong > span{position: absolute;display: block;background: yellow;animation: width-stretch 1s linear 1s;height: 3px;bottom: 0;left: 0;width: 100%;}
.come{font-size: 12px;color: #999;}

.btn,
.title{font-family:'Noto Sans Japanese',"游ゴシック","ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic",sans-serif;}
.btn-contact{background: rgb(255,0,66);
background: linear-gradient(180deg, rgba(255,0,66,1) 0%, rgba(228,5,63,1) 100%);
color: #fff;text-shadow:-1px -1px 1px rgba(0,0,0,.2);}
.btn-contact:hover,
.btn-contact:active,
.btn-contact:focus{color: #fff;
background: rgb(228,5,63);
background: linear-gradient(0deg, rgba(255,0,66,1) 0%, rgba(228,5,63,1) 100%);}

.btn-green{background: #279c05;color: #fff !important;}
.btn-green:hover,
.btn-green:active,
.btn-green:focus{background: #238405;color: #fff;}

.btn-blue2{background: #2258b5;color: #fff !important;}
.btn-blue2:hover,
.btn-blue2:active,
.btn-blue2:focus{background: #164aa3;color: #fff;}

.label{padding: 3px 8px;border-radius:2px;font-size: 12px;}
.label-required{background: #e60012;color: #fff;margin-left: 10px;vertical-align: 2px;}
.label-optional{background: #e6e6e6;color: #999;margin-left: 10px;vertical-align: 2px;border-radius:30px;}
.label-new{background: #fff600;color: #279c05;overflow: hidden;display: inline-block;position: relative;line-height: 1;padding: 3px 5px 2px;}

h1,h2,h3,h4,h5,h6{font-size: 120%;font-weight: bold;}
h1{font-size: 300%;}
h2{font-size: 200%;line-height: 1.4;}
h3{font-size: 150%;}
@media screen and (max-width:900px){
h1{font-size: 240%;}
h2{font-size: 180%;}
h3{font-size: 130%;}
}
@media screen and (max-width:640px){
h1{font-size: 150%;}
h2{font-size: 130%;}
h3{font-size: 110%;}
}

.title{text-align: center;line-height: 1;font-size: 24px;text-align: center;color: #000;margin-bottom:0;font-weight: bold;padding: 20px 0;}
.title .en{display: block;font-size: 12px;ont-weight: bold;line-height: 1;margin-top: 10px;}
.title.white,
.title.white .en{color: #fff;}
.title:after{content:"";display: inline-block;width: 10%;border-bottom: solid 1px #ddd;}
.title.white:after{border-color: #fff;}

.title-sub{font-size: 18px;margin-bottom: 20px;height: 0;line-height: 0;}

.balloon{border-radius:30px;font-size: 90%;padding: 3px 13px 5px;background: #14284c;color: #fff;margin-right: 10px;position: relative;}
.balloon:after {
  top: 30%;
  right: -30%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-color: rgba(255, 255, 255, 0);
	border-left-color: #14284c;
	border-width: 10px;
	margin-left: -10px;
}

a{color: #222;text-decoration: underline;}
a:hover,a:active{color: #666;}
a.no-line{text-decoration: none;}

.btn-black{color: #fff !important;}


.alert-danger{border-color: #f00;color: #f00;}
.alert-danger strong{color: #f00 !important;font-weight: bold;}

@media screen and (max-width:640px){
.title{font-size: 16px;line-height: 1.4;}
}

/* 　header
******************************************/
header{position: relative;text-align: center;}


.header-main{position: relative;}
.header-main .section-inner{padding: 20px 0;position: relative;}

.header-main .logo{float: left;width: 50%;text-align: left;}
.header-main .logo a{text-decoration: none;font-family: 'Roboto',sans-serif;font-weight: bold;font-size: 24px;}

.header-main .util{float: right;width: 50%;text-align: right;}

@media screen and (max-width:900px){
.header-main .section-inner{padding: 10px;}
.header-main .logo a{font-size: 16px;}
.header-main .btn{font-size: 12px;padding: 10px;}

.header-main .logo,
.header-main .util{width: 48%;}
}
@media screen and (max-width:640px){
}
@media screen and (max-width:480px){
}


/* 　nav
******************************************/
nav{position: relative;}
nav .section-inner{padding: 0;}
#globalnav{font-weight: bold;max-width: 1400px;margin: auto;}
#globalnav li{width: 20%;display: block;float: left;border-left: solid 1px #ddd;}
#globalnav li:first-child{border-left: 0;}
#globalnav li.menu-flow{display: none;}
#globalnav li.sp{display: none;}

#globalnav li.active{border-bottom: solid 1px rgb(0,49,90);}

#globalnav a{text-decoration: none;display: block;padding: 10px 5px;color: #000;font-size: 12px;}
#globalnav a:hover,
#globalnav a:active,
#globalnav a:focus{background:#eee;color: #111;}

#globalnav a{font-family:'Noto Sans Japanese',"游ゴシック","ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic",sans-serif;}

#spmenu{display: none;line-height: 1;}
#spmenu i{font-size: 30px;line-height: 0.8;display: inline-block;}
@media screen and (max-width:640px){
#globalnav{display: none;position: absolute;left: 0;top: 0;width: 100%;z-index: 99;}
#globalnav.show{display: block;background: rgba(255,255,255,.9);border-top: solid 1px #ddd;}
#globalnav a{font-size: 12px;padding: 20px 10px;}
#globalnav li{width: 100%;float: none;border-bottom: solid 1px #ddd !important;}

#spmenu{display: inline-block;position: relative;top: 5px;margin-left: 10px;}
#spmenu.open i:before{content:"\f00d";}
}

/* 　breadcrumb
******************************************/
.breadcrumb {background: #eee;padding: 0;margin: 0;border-top: solid 1px #ddd;}
.breadcrumb .inner{max-width: 1200px;margin: auto;}
.breadcrumb ul { display: table;font-size: 11px;text-align: left;}
.breadcrumb ul li { margin: 0; font-size: 11px; float: left;border-right: solid 1px #ddd;}
.breadcrumb ul li a{text-decoration: none;color: #111;display: block;padding: 2px 10px;font-weight: bold;}
.breadcrumb ul li a:hover,
.breadcrumb ul li a:active,
.breadcrumb ul li a:focus{color: #333;background: #999;}
.breadcrumb ul li:last-child a{background: #fff;}

@media screen and (max-width:1200px){
.breadcrumb-inner { width: 100%;padding: 0 10px;}
}
@media screen and (max-width:640px){
.breadcrumb {padding: 0;}
.breadcrumb ul li{font-size: 10px;}
}


.link-home{margin: 30px 0;text-align: center;clear: both;}

/* 　footer
******************************************/

footer{width: 100%;background: #eee;color: #fff;font-size: 12px;text-align: center;border-top: solid 1px #ddd;clear: both;margin-top: 30px;}
.copy{background: #000;color: #fff;text-align: center;padding: 20px 0;font-size: 10px;}

.footer-link{padding: 20px 0;}
.footer-link li{display: inline-block;font-size: 12px;border-right: solid 1px #ddd;}
.footer-link li:last-child{border-right: 0;}
.footer-link li a{display: block;padding: 0 10px;text-decoration: none;}

@media screen and (max-width:640px){
footer .section-inner{padding: 0;}

.footer-link{padding: 0;}
.footer-link li{display: block;width: 100%;border-right: 0;border-bottom: solid 1px #ddd;}
.footer-link li a{padding: 10px;}
}

/* 　cta
******************************************/

.cta-inner h3{display: inline-block;max-width: 413px;}
.cta-inner .btn{width: 100%;padding: 20px;font-size: 110%;}

.cta-sell,.cta-buy{width: 50%;float: left;padding: 10px 10px 20px;}
.cta-buy{background:#f82d62 url(../img/common/cta/buy-img.png) no-repeat 98% top;background-size:contain;padding-right: 10%;}
.cta-buy .btn{color: #f82d62;}
.cta-sell{background:#1b7cd0 url(../img/common/cta/sell-img.png) no-repeat 2% top;background-size:contain;padding-left: 10%;}
.cta-sell .btn{color: #1b7cd0;}

.cta-inner{max-width: 413px;}
.cta-buy .cta-inner{float: right;}
.cta-sell .cta-inner{float: left;}

@media screen and (min-width:641px){
.cta-inner .onlypc{display: inline-block !important;}
}
@media screen and (max-width:640px){
.cta-inner h3{margin-bottom: 10px;}
.cta-inner .btn{padding: 10px;font-size: 80%;}
.cta-sell,.cta-buy{padding: 5px;background-size:20%;}
.cta-buy{background-position: 1% top;}
.cta-sell{background-position: 99% top;}
}

/* 　table
******************************************/

.table-horizontal th{background: #f6f6f6;}

.label-col2 > label{width: 49%;float: left;display: block;margin-right: 1%;}
.label-col2 input{width: 100%;}

.input-tel .sep,
.input-tel input{display: inline-block;}
.input-tel input{width: 20%;}

.input-l{max-width: 300px;width: 100%;}

.input-postcode .sep,
.input-postcode input{display: inline-block;}
.input-postcode input{width: 20%;}

.input-range select{overflow: hidden;}

.form-group:last-child{margin-bottom: 0;}
.form-group .input-s{width: 30%;margin-right: 1%;}
.form-subttl{display: block;}

.form-postcode .icon{display: inline-block;font-size: 20px;}
.form-postcode input{display: inline-block;width:10em;}

/* common
******************************************/

.col50 > div,
.col50 > li{width: 50%;float: left;}

.btn-border{font-size: 13px;border: solid 2px rgb(0,49,90);color: rgb(0,49,90);text-align: center;padding: 10px 50px;font-weight: bold;border-radius:0;position: relative;transition:all .2s linear 0s;overflow: hidden;z-index: 2;}
.btn-border.white{border-color: #fff;color: #fff;}
.btn-border i{margin-right: 10px;}

.btn-border:visited{color: rgb(0,49,90);}
.btn-border:hover,
.btn-border:active,
.btn-border:focus{color: #fff;}
.btn-border.white:visited{color: #fff;}
.btn-border.white:hover,
.btn-border.white:active,
.btn-border.white:focus{color: rgb(0,49,90);}

.btn-border:before {position: absolute;content:"";display: block;background: rgb(0,49,90);transition:all .2s linear 0s; top: 0; left: 0;width: 200%; height: 100%;transform:scale(0);z-index: -1;}
.btn-border:hover:before,
.btn-border:active:before,
.btn-border:focus:before{transform:scale(1) rotate(180deg);left: -1px;}
.btn-border.white:before{background: #fff;}

.btn-border.disabled{border-color: #999;color: #999;}
.btn-border.disabled:visited,
.btn-border.disabled:hover,
.btn-border.disabled:active,
.btn-border.disabled:focus{color: #999;}
.btn-border.disabled:before{display: none;}
.btn-border.disabled .coming{font-size: 10px;display: block;}

.price{line-height: 1;}
.price dt,
.price dd{display: inline-block;}
.price dt{line-height: 0.7;position: relative;}
.price .yen{font-size: 66.6%;margin-right: -0.1em;}
.price .tax{font-size: 10px;display: inline-block;margin-left: -7px;}
.price .unit{font-size: 14px;position: absolute;display: inline-block;top: 3px;right: 1em;}

.title-line{text-align: center;}
.title-line > span{display: inline-block;position: relative;}
.title-line > span:after{content:"";border-bottom: solid 1px rgba(255,255,255,.5);width: 60%;display: block;margin: 20px auto;}



/* home:mainimg
******************************************/

.page-home .mainimg{position: relative;text-align: center;box-shadow:inset 1px 1px 3px 0 rgba(0,0,0,.2);z-index: 2;
background:url(/src/img/home/mainimg-bg.jpg) repeat-x center center;background-size:cover;min-height: 500px;
-webkit-animation: anime1 50s linear infinite;
-ms-animation: anime1 50s linear infinite;
animation: anime1 50s linear infinite;}
.page-home .mainimg{padding-top: 20px;padding-bottom: 20px;}
.page-home .mainimg:before{position: absolute;z-index: 2;display: block;content:"";top: 0;left: 0;width: 100%;height: 100%;background: rgba(0,0,0,.5);}

@-webkit-keyframes anime1 {
0% {background-position: 0 0;}
100% {background-position: -2000px 0;}
}
@keyframes anime1 {
0% {background-position: 0 0;}
100% {background-position: -2000px 0;}
}

.page-home .mainimg .text{color: #fff;width: 50%;padding: 100px 0;text-shadow:1px 1px 5px rgba(0,0,0,.8);margin: auto;position: relative;z-index: 3;}
.page-home .mainimg .text .catch,
.page-home .mainimg .text h1{margin-bottom: 15px;}
.page-home .mainimg .text h1{font-size: 26px;line-height: 1.4;}
.page-home .mainimg .text h2{font-size: 36px;line-height: 1;margin-bottom: 30px;}

@media screen and (max-width:640px){
.page-home .mainimg{min-height: 0;}
.page-home .mainimg .text{padding: 30px 20px;width: 100%;}
.page-home .mainimg .text .catch{font-size: 12px;}
.page-home .mainimg .text h1{font-size: 20px;}
}

/* home:about
******************************************/
.about{background: #111;color: #fff;}

.about .title{padding-top: 0;}

.about .section-inner{padding: 40px 20px;}
.about .left{width: 43%;float: left;}
.about .right{width: 55%;float: right;}

.about-flow{text-align: center;}
.about-flow li{width: 28%;float: left;border: solid 2px #fff;padding: 10px;font-weight: bold;text-align: center;}
.about-flow li .num{display: block;}
.about-flow li.arrow{width: 6%;float: left;border: 0;}
.about-flow li.arrow i{margin-right: 0;}
@media screen and (max-width:900px){
.about .left,
.about .right{width: 100%;float: none;}
.about .right{margin-bottom: 20px;}
}
@media screen and (max-width:640px){
.about .right{font-size: 12px;}
.about-flow li{font-size: 10px;width: 32%;margin-right: 2%;}
.about-flow li:last-child{margin-right: 0;}
.about-flow li.arrow{display: none;}
}
/* home:pattern
******************************************/
.slick-outer{padding: 20px 0;position: relative;}
.slick-pattern{position: relative;display: none;}
.slick-pattern.slick-initialized{display: block;}

@media screen and (max-width:640px){
.slick-outer{padding: 0;}
}
.slick-pattern{max-width: 960px;margin: 0 auto 20px;}
.slick-pattern .slick-slide{position: relative;}
.slick-pattern .info{position: absolute;left: 10px;bottom: 10px;color: #fff;}
.slick-pattern .info .id{font-size: 120px;line-height: 1;font-weight: bold;display: inline-block;}
.slick-pattern .info .name{display: inline-block;}
.slick-pattern .info .name > span{display: block;line-height: 1;}
.slick-pattern .info .name .en{font-size: 3rem;font-weight: bold;}
.slick-pattern .desc{position: absolute;left: 10px;top: 10px;font-size: 24px;color: #fff;text-shadow:1px 1px 2px rgba(0,0,0,.2);}

.nav-pattern .slick-track {
  transform: unset !important;
  width: 100% !important;
	max-width: 980px;
  display: flex;
  justify-content: space-between;
  flex-flow: row wrap;
}
.nav-pattern .slick-slide {
    display: block!important;
    float: none !important;
    flex: 0 0 20%;padding: 0 10px 10px;
		cursor:pointer;transition:all .2s linear 0s;
}
.nav-pattern .slick-slide .name{color: #000;font-weight: bold;display: block;margin-bottom: -2px;}
.nav-pattern .slick-slide:hover{transform:scale(1.02);}

.nav-pattern .slick-current .name{color: #999;}
.nav-pattern .slick-current img{opacity: .5;}

@media screen and (max-width:900px){
.nav-pattern .slick-slide .name{font-size: 12px;}
}
@media screen and (max-width:640px){
.slick-pattern .info .id{font-size: 60px;}
.slick-pattern .info .name .en{font-size: 20px;}
.slick-pattern .info .name .jp{font-size: 12px;}
.slick-pattern .desc{font-size: 14px;}

.nav-pattern .slick-slide{padding: 0 5px;flex: 0 0 25%;}
.nav-pattern .slick-slide .name{font-size: 9px;}
}

/* home:reason
******************************************/
.reason{background: #f6f6f6;padding: 30px 0;}
.reason .single{width: 32%;float: left;margin-right: 2%;margin-bottom: 20px;}
.reason .single:nth-child(3n){margin-right: 0;}
.reason .single:nth-child(3n+1){clear: both;}

.reason .single h2{font-size: 20px;text-align: center;color: #000;margin: 10px 0;}

@media screen and (max-width:900px){
.reason .single h2{font-size: 16px;}
}
@media screen and (max-width:640px){
.reason{padding: 10px 0;}
.reason .single{width: 100%;float: none;margin-right: 0;border-bottom: solid 1px #ddd;padding-bottom: 10px;}
.reason .single:last-child{border-bottom: 0;}
.reason .single img{width: 37%;float: left;}
.reason .single h2,
.reason .single .text{width: 60%;float: right;text-align: left;}
.reason .single h2{margin-top: 0;font-size: 14px;}
.reason .single .text{font-size: 10px;}
}

/* home:flow
******************************************/
.flow{padding: 30px 0;}
.flow .single{width: 18.4%;margin-right: 2%;border: solid 1px #111;float: left;text-align: center;padding: 10px;}
.flow .single:nth-child(5){margin-right: 0;}
.flow .single h2 .step{font-size: 12px;border-bottom: solid 1px #333;display: inline-block;}
.flow .single h2 .text{display: block;font-size: 18px;}
.flow .single .icon{font-size: 36px;color: #bbb;}
.flow .single .desc{font-size: 12px;}

@media screen and (max-width:900px){
.flow{padding: 0;}
.flow .single{position: relative;width: 100%;margin-right: 0;float: none;margin-bottom: 10px;}
.flow .single h2{margin-bottom: 10px;}
.flow .single h2 .step{font-size: 10px;margin-bottom: 10px;}
.flow .single h2 .text{font-size: 14px;}
.flow .single .icon{position: absolute;right: 10px;top: 10px;}
}

/* home:topics
******************************************/

.topics .post-all{margin-bottom: 20px;}
.topics .post-single{width: 32%;margin-right: 2%;float: left;position: relative;}
.topics .post-single:nth-child(3n){margin-right: 0;}
.topics .post-title{font-size: 14px;padding: 10px 0;line-height: 1.4;}
.topics .post-title a{text-decoration: none;}
.topics .post-category{position: absolute;top: 0;left: 0;font-size: 11px;}
.topics .post-category a{display: block;background: #111;color: #fff;padding: 5px 10px;border: solid 1px #000;font-weight: bold;text-decoration: none;}
.topics .post-category a:hover,
.topics .post-category a:active,
.topics .post-category a:focus{background: #fff;color: #111;}

@media screen and (max-width:640px){
.topics .post-single{width: 100%;margin-right: 0;float: none;padding-bottom: 10px;border-bottom: dashed 1px #ddd;margin-bottom: 10px;}
.topics .post-img{width: 30%;float: left;}
.topics .post-content{width: 68%;float: right;}
.topics .post-title{padding-top: 0;font-size: 12px;}
.topics .post-category{position: static;font-size: 10px;}
.topics .post-category a{display: inline-block;padding: 2px 7px;}
}

/* lower
******************************************/


.lower-main{background: no-repeat center;background-size:cover;min-height:300px;margin-bottom: 30px;}

.backhome{clear: both;text-align: center;padding: 20px 0;}
.backhome a{text-decoration: none;color: #111;font-weight: bold;}
.backhome a:hover{color: #999;}
.backhome i{display: inline-block;margin-right: 10px;}

.lower-title{position: relative;font-size: 20px;text-align: center;margin-bottom: 10px;background: #D4E2EC;padding: 10px;color: #000;}
.lower-title:before {
  content: "";
  position: absolute;
  top: 100%; left: 50%; margin-left: -15px;
  border: 15px solid transparent; border-top: 15px solid #D4E2EC;
}

@media screen and (max-width:900px){
.lower-main{background-size: 150%;min-height:150px;}
.lower-title{font-size: 16px;}

.lower p{font-size: 12px;}
.backhome{font-size: 10px;}
}

/* estimate
******************************************/
.page-estimate .lower-main{background-image: url(/src/img/estimate/mainimg.jpg);}

.table-estimate{max-width: 960px;margin: auto;}
.table-estimate tr{border-top: solid 1px #ddd;}
.table-estimate th{width: 30%;padding: 20px;}
.table-estimate td{width: 70%;}

.table-estimate th .num{background: #999;color: #fff;border-radius:30px; padding: 3px 7px;display: inline-block;margin-right: 3px;}

.table-estimate .nav-pattern .slide{transition:none;}
.table-estimate .nav-pattern .slick-slide{padding: 0;}
.table-estimate .nav-pattern .slick-slide:hover{transform:none;}
.table-estimate .nav-pattern .slick-slide .name{font-size: 12px;}
.table-estimate .nav-pattern label{border: solid 1px #fff;padding: 5px;}
.table-estimate .nav-pattern input{display: none;}

@media screen and (max-width:640px){

.table-estimate,
.table-estimate thead,
.table-estimate tbody,
.table-estimate tfoot,
.table-estimate tr,
.table-estimate th,
.table-estimate td{display: block;width: 100%;}
.table-estimate th,
.table-estimate td{font-size: 11px;padding: 10px;}
.table-estimate th{background: #111;color: #fff;}

.table-estimate .come{display: block;font-size: 10px;margin-bottom: 5px;}

.table-estimate .nav-pattern .slick-slide{padding: 0 5px;flex: 0 0 25%;}
.table-estimate .nav-pattern .slick-slide .name{font-size: 9px;line-height: 1.2;}
.table-estimate .nav-pattern label{padding: 0;}
}


.plan-detail{background: #eee;padding: 20px 0 0;}
.plan-detail .come{margin-top: -10px;}

.plan-group{margin-bottom: 40px;}

.plan-box{background: #fff;max-width: 960px;margin: auto;border-bottom: solid 1px #ddd;}

.plan-box .plan-header{display: table;width: 100%;height: 100%;}
.plan-box .plan-header > div{display: table-cell;padding: 10px;vertical-align: middle;height: 100%;}

/*.plan-box .plan-header > div{float: left;padding: 10px;vertical-align: middle;}*/
.plan-box .plan-check{width: 10%;text-align: center;}
.plan-box .plan-title{width: 30%;}
.plan-box .plan-price{width: 40%;}
.plan-box .plan-img{width: 10%;}
.plan-box .plan-icon{width: 10%;}

.plan-box .plan-check{padding: 0 !important;}
.plan-box .plan-check label{display: block;height: 100%;cursor:pointer;border: 0 !important;background-color: transparent;}
.plan-box .plan-check label:hover{background: #eee;}
.plan-box .plan-check label input{position: relative;top: 30%;}

.plan-customize .plan-box .plan-price{width: 20%;}
.plan-customize .plan-box .item-quantity{width: 20%;}

.plan-box.plan-total .plan-header{width: 100%;display: table;}
.plan-box.plan-total .plan-title{width:50%;padding-left: 30px;font-size: 20px;}
.plan-box.plan-total .plan-price{width:50%;padding-right: 30px;text-align: right;}
.plan-box.plan-total .plan-title .num{background: #000;display: inline-block;color: #fff;line-height: 1;font-size: 18px;padding: 3px 7px;margin-right: 10px;}
.plan-box.plan-total .price .num{font-weight: bold;font-size: 26px;line-height: 1;}

.plan-box .plan-img{cursor:pointer;}
.plan-box .plan-img img{transtion:all .2s linear 0s;}
.plan-box .plan-img:hover img{transform:scale(1.02);}

.plan-box .plan-title{font-weight: bold;font-size: 14px;}
.plan-box .plan-title .brand{display: block;font-size: 10px;color: #999;margin-top: -2px;}
.plan-box .plan-icon{text-align: center;}

.plan-box .plan-price{text-align: right;}
.plan-box .plan-price .num{font-size: 20px;font-weight: bold;}
.plan-box .plan-price .tax{display: block;text-align: right;font-size: 11px;font-weight: bold;margin-top: -2px;}
.plan-box .plan-price .come{font-size: 12px;color: #ccc;text-align: center;}

.plan-box .item-quantity{}
.plan-box .item-quantity input{width: 5em;padding: 5px 10px;}
.plan-box .item-quantity input[disabled]{background: #eee;color: #ccc;}

.plan-box .plan-body{display: none;padding: 15px;background: #f6f6f6;} 
.plan-box.show .plan-body{display: block;} 

.plan-box .plan-icon{cursor:pointer;}
.plan-box .plan-icon:hover i{color: #999;}
.plan-box .plan-icon i{transition:all .2s linear 0s;margin-right: 0;}
.plan-box.show .plan-icon i{transform:rotate(-45deg);}

.plan-box .plan-body .item-main{width: 49%;float: left;}
.plan-box .plan-body .item-info{width: 49%;float: right;}

.plan-box .plan-body .item-info .logo{display: block;padding: 5px 0;}
.plan-box .plan-body .item-info .logo img{max-width: 100px;}
.plan-box .plan-body .item-info .desc{font-size: 11px;line-height: 1.6;display: block;margin-top: 5px;}

.plan-box .plan-body .item-info .item-detail li{line-height: 1;padding: 5px;}
.plan-box .plan-body .item-detail .heading{display: block;font-size: 14px;font-weight: bold;margin-top: 10px;line-height: 1.4;}
.plan-box .plan-body .item-detail.colgroup1 li{width: 100%;float: none;}
.plan-box .plan-body .item-detail.colgroup2 li{width: 50%;float: left;}
.plan-box .plan-body .item-detail.colgroup3 li{width: 33.33%;float: left;}
.plan-box .plan-body .item-detail.colgroup4 li{width: 25%;float: left;}
.plan-box .plan-body .item-detail.colgroup5 li{width: 20%;float: left;}

@media screen and (max-width:1200px){
.plan-detail .section-inner{padding: 10px;}

.plan-box{font-size: 12px;}
.plan-box .plan-check{width: 10%;}
.plan-box .plan-title{width: 20%;font-size: 12px;}
.plan-box .plan-img{width: 20%;}
.plan-box .plan-icon{width: 10%;}
.plan-customize .plan-box .plan-price{width: 20%;}
.plan-customize .plan-box .item-quantity{width: 30%;}
.plan-box .item-quantity input{width: 3em;height: 2em;}
.plan-box.plan-total .plan-title,
.plan-box.plan-total .plan-price{width: 50%;}
}
@media screen and (max-width:640px){
	
/*.plan-box .plan-header > div{padding: 5px;}*/
.plan-box .plan-header{padding: 10px;position: relative;}
.plan-box .plan-header > div{display: block;padding: 0;}
.plan-box .plan-check{width: 10%;float: left;background: #eee;position: absolute;top: 0;left: 0;height: auto !important;}
.plan-box .plan-title{width: 58%;float: right;}
.plan-box .plan-img{width: 30%;float: left;margin-left: 10%;margin-right: 2%;}
.plan-box .plan-check label{padding: 5px 10px;}
.plan-box .plan-check input{margin-top: 0;}

.plan-box .plan-price{width: 58%;float: right;text-align: left;margin-top: 5px;}
.plan-box .plan-icon{width: 10%;position: absolute;bottom: 0;right: 0;top: auto;height: auto !important;background: #000;color: #fff;}
.plan-box .plan-icon i{margin: 10px 0;}

.plan-box .plan-title{font-size: 14px;}
.plan-box .plan-body .item-main,
.plan-box .plan-body .item-info{width: 100%;float: none;}
.plan-box .plan-price .num{font-size: 18px;}
.plan-box .plan-price .tax{font-size: 9px;text-align: left;display: inline-block;}
.plan-box .plan-price .come{font-size: 10px;}

.plan-box.plan-total .plan-title{float: left;padding-left: 0;font-size: 16px;padding-top: 10px;}
.plan-box.plan-total .plan-price{float: right;padding-right: 0;}
.plan-box.plan-total .plan-price .num{font-size: 20px;}

.plan-customize .plan-box .plan-price{width: 58%;text-align: left;}
.plan-customize .plan-box .item-quantity{width: 58%;float: right;text-align: left;padding-top: 5px;}

.plan-customize .plan-total .plan-price{width: 50%;text-align: right;}

.plan-box .plan-body .item-info .logo{padding-bottom: 0;}
.plan-box .plan-body .item-detail .heading{font-size: 12px;margin-top: 0;}
.plan-box .plan-body .item-detail img{margin-bottom: 5px;}
.plan-box .plan-body .item-info .desc{font-size: 10px;}
}

.plan-result{padding: 40px 0;}
.plan-result .result-box .section-inner{padding: 10px 0;}

.plan-result .plan-box{border: solid 5px #000;}
.plan-result .plan-box .plan-title{text-align: center;font-size: 20px;border-right: solid 1px #ddd;}
.plan-result .plan-box .plan-price {border-right: solid 1px #ddd;text-align: center;}
.plan-result .plan-box .plan-price .num{font-size: 30px;}
.plan-result .plan-box .plan-price .tax{text-align: center;}
.plan-result .plan-box .plan-submit{text-align: center;}

.plan-result .result-box.fixed{position: fixed;bottom: 0;left: 0;width: 100%;background: rgba(0,0,0,.5);}

@media screen and (max-width:1200px){
.plan-result .result-box .section-inner{padding: 10px;}
}
@media screen and (max-width:640px){
.plan-result{padding: 10px;}
.plan-result .plan-box .plan-submit{clear: both;text-align: center;}
.plan-result .plan-box .plan-title{font-size: 16px;width: 50%;float: left;border: 0;padding-top: 10px;}
.plan-result .plan-box .plan-price{width: 50%;float: right;border: 0;margin-top: 0;margin-bottom: 5px;}
.plan-result .plan-box .plan-price .tax{margin-top: -2px;display: block;}
.plan-result .plan-box .plan-price .num{font-size: 24px;}

}

/* merit
******************************************/


.page-merit .lower-main{background-image: url(/src/img/merit/mainimg.jpg);}

.page-merit .merit-reason .single{width: 49%;float: left;font-size: 12px;}
.page-merit .merit-reason .single:nth-child(2n){float: right;}
.page-merit .merit-reason h3{text-align: center;color: #10466D;}
.page-merit .merit-reason .img{text-align: center;}
.page-merit .merit-reason .img img{max-width: 400px;}

.page-merit .merit-point{background: #fff;}
.page-merit .merit-point li{width: 25%;float: left;padding: 10px;}
.page-merit .merit-point .text{display: block;font-weight: bold;margin-top: 10px;text-align: center;}

@media screen and (max-width:640px){
.page-merit .lower-main{background-postion: -100px;}

.page-merit .merit-reason .single{width: 100%;}
.page-merit .merit-reason h3{margin-bottom: 10px;}
.page-merit .merit-reason .desc p{font-size: 10px;}

.page-merit .merit-point li{width: 50%;}
.page-merit .merit-point .text{font-size: 12px;}

}

/* menu
******************************************/

.page-menu .lower-main{background-image: url(/src/img/menu/mainimg.jpg);}

.page-menu .menu-list h3{border-bottom: solid 2px #D4E2EC;margin-bottom: 10px;}
.page-menu .menu-list .num{font-size: 48px;line-height: 1;}

.page-menu .menu-list .single{padding: 20px 0;border-bottom: dashed 1px #ddd;}
.page-menu .menu-list .single:last-child{border-bottom: 0;}
.page-menu .menu-list .text{width: 57%;float: right;}
.page-menu .menu-list .img{width: 40%;float: left;}

@media screen and (max-width:640px){
.page-menu .menu-list .text,
.page-menu .menu-list .img{width: 100%;float: none;}
}

/* contact
******************************************/
.page-contact .lower-main{background-image: url(/src/img/contact/mainimg.jpg);}

.well{max-width: 960px;margin: auto;}
.well p:last-child{margin-bottom: 0;}

.sub-title{font-size: 20px;text-align: center;margin-bottom: 10px;}
.page-contact .form-group{margin-bottom: 20px;padding-top: 20px;}

.table-contact{max-width: 960px;border: solid 2px #111;}
.table-contact tr{border-bottom: solid 1px #ddd;}

.table-price thead th{background: #111;color: #fff;}
.table-price th,
.table-price td{padding: 5px;font-size: 12px;text-align: center;}
.table-price .cell-title{width: 40%;}
.table-price .cell-unit{width: 10%;}
.table-price .cell-price{width: 50%;}
.table-price .cell-price .num{font-weight: bold;font-size: 18px;}
.table-price .cell-price .tax{font-size: 10px;display: inline-block;margin-left: 5px;color: #999;}

.table-price .row-total th{background: #e80d52;color: #fff;}
.table-price .row-total td{color: #e80d52;background: rgba(232,13,82,.1);}

@media screen and (max-width:640px){
.table-price .cell-unit{width: 20%;}
.table-price .cell-price{width: 40%;}

.table-price .cell-title{font-size: 10px;}
.table-price .cell-price .num{font-size: 16px;}
.table-price .cell-price .tax{display: block;text-align: center;margin-top: -5px;}

.row-address .input-s{width: 100%;}
}