/*
v1.0 2018-8
Juita Web Design バリ島ウェブ制作
https://juita.net
Theme for：ファクタリングコンシェルジュ
*****************************/

/*****************************************************************
max-width 1024
******************************************************************/
@media screen and (max-width: 1024px) {
.wmain,.header .hti h1{width: 98%;}
.merit ul{width: 65%;}
.reason .ti{font-size: 18px; letter-spacing: 0;}
.reason .ti:after{content: "";}
.cta{width: 98%;}
.footer .copyright{margin: 0 0 80px;}
.nav ul li{padding: 0 25px;}
.flowfaq ul.flow li{width: 19%;}
.flowfaq ul.qa,.company .privacy{width: 85%;}
}

/*****************************************************************
max-width 768
******************************************************************/
@media screen and (max-width: 768px) {
.nav ul li{padding: 0 30px; margin: 0 0 10px;}
.nav ul li:last-child:after{display: none;}
.merit ul,.company .cpdtl{width: 85%;}
.reason .ti{font-size: 15px;}
.cta{padding: 40px 0 20px;}
.voice li .ti{font-size: 14px;}
.voice li{padding: 20px;width: 24%;}
.pvoice ul{width: 92%;}
.cta h3{font-size: 32px;}
.cta .ti{font-size: 30px;}
.flowfaq ul.flow li .img{padding: 10px 5px;}
.flowfaq ul.flow li{margin: 0 20px;vertical-align: bottom;}
.flowfaq ul.flow li .ti{font-size: 14px;}
.flowfaq ul.flow li .stp{font-size: 15px;}
.flowfaq ul.flow li:after{top: 13%; right: -38px;}
}

/*****************************************************************
max-width 550
******************************************************************/
@media screen and (max-width: 550px) {
.pc{display: none;}
.sp{display: inline-block;}
.breadcrumb{font-size: 10px;}
h2{font-size: 21px!important; line-height: 1.6em!important}
#header .nav{display: none;}
.header .hti h1{font-size: 10px;}
.header .logo{width: 100%; text-align: center; margin: 10px 0 0;}
.header .logo img{width: 240px;}
.header .head-cta{width: 40%; padding: 5px; background: #fff; display: none;}
.header .head-cta
.header .head-cta li{width: 47%;}
.desc h2{line-height: 1.6em;}
.desc p{font-size: 14px;}
.merit h2{font-size: 24px;}
.merit ul li{font-size: 20px; letter-spacing: 0; height:auto;}
.merit_txt{font-size:14px; padding:10px;}
.reason h2{font-size: 18px;}
.reason ul li{width: 100%; overflow: hidden;margin: 0 0 20px;}
.reason ul li .img{float: left; width: 30%;}
.reason ul li .txt{float: right; width: 65%;}
.reason ul li .txt .ti{text-align: left; margin: 0 0 15px;}
.reason ul li .txt .ti br{display: none;}
.voice li{padding: 15px; width: 85%; min-height: inherit;}
.voice li .img{float: left; width: 20%; margin: 0;}
.voice li .ti{font-size: 18px; text-align: left; width: 75%;float: right;}
.footer .nav{display: none;}
.flowfaq .top .ti{font-size: 44px;}
.flowfaq .top .ti{font-size: 28px;}
.flowfaq ul.flow li{width: 100%; margin: 0 0 30px; overflow: hidden;}
.flowfaq ul.flow li .img{width: 30%; float: left;}
.flowfaq ul.flow li .txt{float: right; width: 65%;}
.flowfaq ul.flow{margin: 80px 0;}
.flowfaq ul.flow li:after{display: none;}
.flowfaq ul.qa, .company .privacy{width: 90%;}
.flowfaq ul.qa li .q{font-size: 15px;background-size: 25px;padding: 12px 0 10px 35px;}
.flowfaq ul.qa li .a{font-size: 14px;background-size: 20px;padding: 0px 0 10px 35px;}
.flowfaq ul.qa li{margin: 0 0 15px;}
.footer .cmpy{margin: 0;}
.company .cpydtl,.company .map{float: none;width: 100%;}
.merit ul,.company .cpdtl{width: 92%;}
.footer .gotop{width: 32px;bottom: 75px;}
.popup_form{width: 310px; margin: 0 auto; left: 0; right: 0;}
.popup_form #form-btn #clk{font-size: 16px;padding: 10px 10px;}
.popup_form #form-btn:after{top: 4px;}
.popup_form #form-btn .puchi{width: 40px;top: -20px;right: 48px;}
.nav ul li{width: 100%; padding: 3px 0; border-bottom: 1px solid #eee;}
.nav ul li:last-child{margin: 0; border:none;}
.nav ul li:after,.nav ul:before{display: none;}
.feature .sub{font-size: 18px;}

.feature .top,.pvoice .top,.flowfaq .top,.company .top{background-position: center right -170px;padding: 35px 0;}

.cta {width: 95%; text-align: left; margin: 20px 0 30px;}
.cta .btn{width: 85%; margin: 15px auto 10px;}
.cta h3{font-size: 20px; padding: 0 0 0 15px;}
.cta .ti {font-size: 16px; padding: 0 0 0 15px;}
.cta .cta-mdl{width: 200px; top: -24px; bottom: inherit;}

.nvcontainer {display: block;cursor: pointer;position: absolute; right: 10px; top: 35px;
background: #ff9dcb; padding: 5px; border-radius: 3px;}
.bar1, .bar2, .bar3 {
width: 28px;height: 4px;background-color: #fff;margin: 3px 0;transition: 0.4s;}
.change .bar1 {
-webkit-transform: rotate(-45deg) translate(-5px, 5px);
transform: rotate(-45deg) translate(-5px, 5px);}
.change .bar2 {opacity: 0;}
.change .bar3 {-webkit-transform: rotate(45deg) translate(-5px, -5px);
transform: rotate(45deg) translate(-5px, -5px);}

.form .sub{font-size: 16px;}
.form .mailform{width: 95%; padding: 5px;}
.form table th,.form table td{width: 100%; display: block; padding: 0;}
.form table td{margin: 0 0 20px; border-bottom: 1px dotted #ddd; padding: 0 0 15px;}
.form table th{margin: 0 0 8px;}
.mail-btn li{display: block; margin: 0 0 5px;}
.form table.formTable-confirm{padding: 0 10px;width: 95%; margin: 30px auto;}
.confirm table th{border:none;}

}

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