@charset "utf-8";
/*---------------------------------------*/
/* contactArea */
/*---------------------------------------*/
.contactArea{
background: #e6f0f5;
padding: 50px 0;
}
.contactArea .areaInner{
max-width: 1100px;
}
.contactArea .ttlArea{
margin-bottom: 47px;
}
@media screen and (max-width:980px){
.contactArea .ttlArea{
text-align: center;
margin-bottom: 30px;
}
}
@media screen and (max-width:767px){
.contactArea .ttlArea{
margin-bottom: 15px;
}
}
.contactArea .ttlArea span{
display: inline-block;
font-size: 264.5%;
}
@media screen and (max-width:1300px){
.contactArea .ttlArea span{
font-size: 200%;
}
}
@media screen and (max-width:767px){
.contactArea .ttlArea span{
font-size: 16pt;
}
}
@media screen and (max-width:374px){
.contactArea .ttlArea span{
font-size: 14pt;
}
}
.contactArea .ttlArea .bg{
background: #6ea8c5;
line-height: 1.4;
border-radius: 3px;
color: #fff;
padding: 0 17px 3px;
margin-right: 10px;
}
@media all and (-ms-high-contrast:none) {
.contactArea .ttlArea .bg{
padding: 12px 17px 0;
}
}
@media screen and (max-width:980px){
.contactArea .ttlArea .bg{
padding: 0 12px 3px;
margin-right: 6px;
font-size: 171.5%;
}
.contactArea .ttlArea .bg:nth-child(3){
margin-right: 0;
}
}
@media screen and (max-width:767px){
.contactArea .ttlArea .bg{
padding: 0 12px 2px;
font-size: 13pt;
}
}
@media screen and (max-width:374px){
.contactArea .ttlArea .bg{
padding: 0 10px 2px;
margin-right: 4px;
font-size: 12pt;
}
.contactArea .ttlArea .bg:nth-child(3){
margin-right: 0;
}
}
.contactArea .contactContent{
margin-bottom: 40px;
}
@media screen and (max-width:767px){
.contactArea .contactContent{
margin-bottom: 20px;
}
}
.contactArea .telArea,
.contactArea .mailArea{
width: 47.27%;
background: #fff;
position: relative;
padding: 20px 0 30px;
}
@media screen and (max-width:1050px){
.contactArea .telArea,
.contactArea .mailArea{
width: 48%;
}
}
@media screen and (max-width:767px){
.contactArea .telArea,
.contactArea .mailArea{
width: 100%;
float: none;
padding: 15px 0 20px;
}
}
.contactArea .telArea:before,
.contactArea .mailArea:before,
.contactArea .telArea:after,
.contactArea .mailArea:after{
content: "";
display: block;
width: 0;
height: 0;
position: absolute;
}
.contactArea .telArea:before,
.contactArea .mailArea:before{
border-top: 22px solid #e6f0f5;
border-right: 22px solid transparent;
border-bottom: 22px solid transparent;
border-left: 22px solid #e6f0f5;
top: 0;
left: 0;
}
@media screen and (max-width:767px){
.contactArea .telArea:before,
.contactArea .mailArea:before{
border-top: 12px solid #e6f0f5;
border-right: 12px solid transparent;
border-bottom: 12px solid transparent;
border-left: 12px solid #e6f0f5;
}
}
.contactArea .telArea:after,
.contactArea .mailArea:after{
border-top: 22px solid transparent;
border-right: 22px solid #e6f0f5;
border-bottom: 22px solid #e6f0f5;
border-left: 22px solid transparent;
bottom: 0;
right: 0;
}
@media screen and (max-width:767px){
.contactArea .telArea:after,
.contactArea .mailArea:after{
border-top: 12px solid transparent;
border-right: 12px solid #e6f0f5;
border-bottom: 12px solid #e6f0f5;
border-left: 12px solid transparent;
bottom: 0;
right: 0;
}
}
.contactArea .telArea{
margin-right: 5.46%;
}
@media screen and (max-width:1050px){
.contactArea .telArea{
margin-right: 4%;
}
}
@media screen and (max-width:767px){
.contactArea .telArea{
margin-right: 0;
margin-bottom: 15px;
}
}
.contactArea .inner{
text-align: center;
width: 90%;
margin: 0 auto;
}
.contactArea .telArea .inner{
max-width: 420px;
}
.contactArea .contactContent .contactTtl{
margin-bottom: 20px;
font-size: 143%;
color: #6ea8c5;
font-weight: bold;
}
@media screen and (max-width:767px){
.contactArea .contactContent .contactTtl{
font-size: 11pt;
margin-bottom: 10px;
}
}
.contactArea .telArea .tel{
font-size: 414.5%;
line-height: 1;
margin-bottom: 15px;
}
@media screen and (max-width:1200px){
.contactArea .telArea .tel{
font-size: 357%;
}
}
@media screen and (max-width:980px){
.contactArea .telArea .tel{
font-size: 271.5%;
margin-bottom: 25px;
}
}
@media screen and (max-width:767px){
.contactArea .telArea .tel{
font-size: 25pt;
margin-bottom: 15px;
}
}
.contactArea .telArea .tel .icon{
font-size: 50px;
color: #6ea8c5;
display: inline-block;
margin-right: 5px;
}
@media screen and (max-width:980px){
.contactArea .telArea .tel .icon{
font-size: 38px;
}
}
@media screen and (max-width:767px){
.contactArea .telArea .tel .icon{
font-size: 30px;
}
}
.contactArea .contactContent .hour{
font-size: 143%;
text-align: left;
}
@media screen and (max-width:980px){
.contactArea .contactContent .hour{
font-size: 114.5%;
text-align: center;
}
}
@media screen and (max-width:767px){
.contactArea .contactContent .hour{
font-size: 10pt;
}
}
.contactArea .contactContent .telArea .hour{
margin-left: 18px;
}
@media screen and (max-width:1200px){
.contactArea .contactContent .telArea .hour{
text-align: center;
margin-left: 0;
}
}
.contactArea .contactContent .hour .ttl{
font-size: 90%;
display: inline-block;
border: 1px solid #333;
padding: 0 10px;
margin-right: 10px;
}
@media all and (-ms-high-contrast:none) {
.contactArea .contactContent .hour .ttl{
padding: 5px 10px 0;
}
}
@media screen and (max-width:980px){
.contactArea .contactContent .hour .ttl{
font-size: 87.5%;
}
}
@media screen and (max-width:767px){
.contactArea .contactContent .hour .ttl{
font-size: 9pt;
}
}
.contactArea .mailArea .inner{
max-width: 380px;
}
.contactArea .mailArea .mail{
margin: 0 auto 12px;
background: #000;
border: 1px solid #000;
font-size: 143%;
font-weight: bold;
}
@media screen and (max-width:980px){
.contactArea .mailArea .mail{
font-size: 128.5%;
}
}
@media screen and (max-width:767px){
.contactArea .mailArea .mail{
font-size: 10pt;
}
}
.contactArea .mailArea .mail a{
display: block;
padding: 12px 0;
}
@media all and (-ms-high-contrast:none) {
.contactArea .mailArea .mail a{
padding: 14px 0 10px;
}
}
@media screen and (max-width:980px){
.contactArea .mailArea .mail a{
padding: 10px 0;
}
}
.contactArea .mailArea .mail a:hover{
background: #fff;
}
.contactArea .bottomTxt{
font-size: 143%;
border: 1px solid #898989;
text-align: center;
line-height: 1.4;
padding: 5px 0;
}
@media all and (-ms-high-contrast:none) {
.contactArea .bottomTxt{
padding: 6px 0 4px;
}
}
@media screen and (max-width:980px){
.contactArea .bottomTxt{
font-size: 11pt;
}
}

/*---------------------------------------*/
/* featureArea */
/*---------------------------------------*/
.bgOuter{
background: linear-gradient(to bottom, #e6f0f5 7.11%, #f8fafc 88.63%, #f8fafc);
}
#featureArea{
margin-bottom: 190px;
overflow: hidden;
}
@media screen and (max-width:980px){
#featureArea{
margin-bottom: 0;
}
}
.message{
position: relative;
background: #fff;
margin-bottom: 275px;
}
@media screen and (max-width:980px){
#featureArea .message{
margin-bottom: 155px;
}
}
@media screen and (max-width:767px){
#featureArea .message{
margin-bottom: 85px;
}
}
#featureArea .message:before{
content: "";
display: block;
position: absolute;
width: 0;
height: 0;
border-top: 130px solid transparent;
border-bottom: 130px solid transparent;
border-right: 50vw solid #fff;
bottom: -130px;
left: 50%;
margin-left: -50vw;
}
@media screen and (max-width:1300px){
#featureArea .message:before{
border-top: 10vw solid transparent;
border-bottom: 10vw solid transparent;
border-right: 50vw solid #fff;
bottom: -10vw;
}
}
#featureArea .message:after{
content: "";
display: block;
position: absolute;
width: 0;
height: 0;
border-top: 130px solid transparent;
border-bottom: 130px solid transparent;
border-left: 50vw solid #fff;
bottom: -130px;
right: 50%;
margin-right: -50vw;
}
@media screen and (max-width:1300px){
#featureArea .message:after{
border-top: 10vw solid transparent;
border-bottom: 10vw solid transparent;
border-left: 50vw solid #fff;
bottom: -10vw;
}
}
#featureArea .message .img{
max-width: 980px;
margin: 0 auto;
position: relative;
z-index: 10;
padding-bottom: 25px;
}
@media screen and (max-width:767px){
#featureArea .message .img{
max-width: 400px;
width: 80%;
padding-bottom: 25px;
}
}
#featureArea .message .img img{
width: 100%;
height: auto;
}

#featureArea .areaTtl-jp{
margin-bottom: 45px;
}
@media screen and (max-width:767px){
#featureArea .areaTtl-jp{
margin-bottom: 30px;
}
}
#featureArea .subTtl{
font-size:128.5%;
text-align:center;
color:#6ea8c5;
font-weight:bold;
margin-bottom:15px;
}
@media screen and (max-width:767px){
#featureArea .subTtl{
font-size:11pt;
}
}
#featureArea .ttlNote{
text-align:center;
font-size:114.5%;
}
@media screen and (max-width:767px){
#featureArea .ttlNote{
font-size:9pt;
text-align:left;
}
}
#featureArea .contentOuter{
padding:50px 0;
}
@media screen and (max-width:767px){
#featureArea .contentOuter{
padding:30px 0;
}
}
#featureArea .contentOuter .areaInner{
background:url(../images/common/bg-featurein-top.png) top left no-repeat,url(../images/common/bg-featurein-bottom.png) bottom right no-repeat;
background-size:auto 80px;
padding:80px 0;
max-width: 1050px;
}
@media screen and (max-width:767px){
#featureArea .contentOuter .areaInner{
background:rgba(255,255,255,0.9);
padding:40px 0;
}
}
#featureArea .contentOuter .areaInner .featureContent{
background:#fff;
padding:0 5%;
}
@media screen and (max-width:767px){
#featureArea .contentOuter .areaInner .featureContent{
background:none;
}
}
#featureArea .contentOuter .areaInner ul{
max-width:900px;
margin:0 auto;
}
@media screen and (max-width:980px){
#featureArea .contentOuter .areaInner ul{
max-width:420px;
}
}
#featureArea .contentOuter .areaInner ul li{
width:33.33%;
float:left;
text-align:center;
}
@media screen and (max-width:980px){
#featureArea .contentOuter .areaInner ul li{
width:100%;
margin-left:0;
margin-bottom:30px;
padding-bottom:20px;
border-bottom:1px dashed #6ea8c5;
}
}
@media screen and (max-width:767px){
#featureArea .contentOuter .areaInner ul li{
margin-bottom:18px;
padding-bottom:12px;
}
}
#featureArea .contentOuter .areaInner ul li .inner{
position: relative;
}
@media screen and (max-width:980px){
#featureArea .contentOuter .areaInner ul li .inner{
min-height: 105px;
}
}
@media screen and (max-width:767px){
#featureArea .contentOuter .areaInner ul li .inner{
min-height: 81px;
}
}
#featureArea .contentOuter .areaInner ul li .img.ttl{
margin-bottom:20px;
}
@media screen and (max-width:767px){
#featureArea .contentOuter .areaInner ul li .img.ttl{
margin-bottom:15px;
}
}
#featureArea .contentOuter .areaInner ul li .iconOuter{
margin-bottom:25px;
}
@media screen and (max-width:980px){
#featureArea .contentOuter .areaInner ul li .iconOuter{
position:absolute;
top:-5px;
left:0;
}
}
#featureArea .contentOuter .areaInner ul li img{
height:auto;
display:block;
margin-left:auto;
margin-right:auto;
}
#featureArea .contentOuter .areaInner ul li .ttl img{
width:90%;
max-width:260px;
}
@media screen and (max-width:767px){
#featureArea .contentOuter .areaInner ul li .ttl img{
max-width:215px;
}
}
#featureArea .contentOuter .areaInner ul li .iconOuter .icon{
font-size: 105px;
color: #6ea8c5;
}
@media screen and (max-width:767px){
#featureArea .contentOuter .areaInner ul li .iconOuter .icon{
font-size: 78px;
}
}
#featureArea .contentOuter .areaInner ul li .note{
text-align:left;
font-size:114.5%;
max-width: 222px;
margin: 0 auto;
}
@media screen and (max-width:980px){
#featureArea .contentOuter .areaInner ul li .note{
text-align:left;
margin-left:150px;
margin-top:20px;
}
}
@media screen and (max-width:767px){
#featureArea .contentOuter .areaInner ul li .note{
margin-left:115px;
margin-top:15px;
font-size:10pt;
line-height: 1.6;
max-width: inherit;
}
}
/*---------------------------------------*/
/* serviceArea */
/*---------------------------------------*/
#serviceArea{
padding:90px 0 195px;
}
@media screen and (max-width:980px){
#serviceArea{
padding:90px 0 55px;
}
}
@media screen and (max-width:767px){
#serviceArea{
padding:30px 0 30px;
}
}
@media all and (-ms-high-contrast:none) {
#serviceArea .areaTtl-en{
top: -10px;
}
}
#serviceArea .areaInner.narrow{
max-width: 930px;
width: 85%;
}
@media screen and (max-width:767px){
#serviceArea .areaInner.narrow{
width: 90%;
}
}
#serviceArea .areaInner .serviceContent .areaTtl-jp{
margin-bottom: 45px;
}
@media screen and (max-width:767px){
#serviceArea .areaInner .serviceContent .areaTtl-jp{
margin-bottom: 30px;
}
}
#serviceArea .areaInner .serviceContent .ttlNote{
text-align:center;
font-size:114%;
margin-bottom: 50px;
}
@media screen and (max-width:767px){
#serviceArea .areaInner .serviceContent .ttlNote{
font-size:9pt;
margin-bottom:20px;
}
}
#serviceArea .areaInner .serviceContent ul li{
display:inline;
width:32.26%;
float:left;
margin-right:1.61%;
margin-bottom:45px;
position:relative;
text-align: center;
background: #fff;
padding: 30px 0 20px;
}
@media screen and (max-width:767px){
#serviceArea .areaInner .serviceContent ul li{
width:100%;
max-width: 350px;
margin: 0 auto 30px;
text-align: left;
float: none;
display: block;
padding: 15px 0;
}
}
#serviceArea .areaInner .serviceContent ul li:nth-child(3n){
margin-right:0;
}
@media screen and (max-width:767px){
#serviceArea .areaInner .serviceContent ul li:nth-child(3n){
margin-right:auto;
}
}
@media screen and (max-width:767px){
#serviceArea .areaInner .serviceContent ul li .inner{
position: relative;
width: 90%;
margin: 0 auto 10px;
min-height: 110px;
}
}
@media screen and (max-width:374px){
#serviceArea .areaInner .serviceContent ul li .inner{
min-height: 100px;
}
}
#serviceArea .areaInner .serviceContent ul li .ttl{
font-size: 171.5%;
margin-bottom: 15px;
}
@media screen and (max-width:980px){
#serviceArea .areaInner .serviceContent ul li .ttl{
font-size: 143%;
}
}
@media screen and (max-width:767px){
#serviceArea .areaInner .serviceContent ul li .ttl{
margin-left: 130px;
font-size: 14pt;
padding-top: 10px;
margin-bottom: 10px;
}
}
@media screen and (max-width:374px){
#serviceArea .areaInner .serviceContent ul li .ttl{
margin-left: 115px;
font-size: 12pt;
}
}
#serviceArea .areaInner .serviceContent ul li .ttl .icon{
font-size: 30px;
color: #6ea8c5;
position: relative;
top: 3px;
}
@media screen and (max-width:980px){
#serviceArea .areaInner .serviceContent ul li .ttl .icon{
font-size: 25px;
}
}
@media screen and (max-width:374px){
#serviceArea .areaInner .serviceContent ul li .ttl .icon{
font-size: 22px;
}
}
#serviceArea .areaInner .serviceContent ul li .img{
width: 75%;
max-width: 200px;
margin: 0 auto 15px;
}
@media screen and (max-width:767px){
#serviceArea .areaInner .serviceContent ul li .img{
position: absolute;
top: 0;
left: 0;
width: 110px;
}
}
@media screen and (max-width:374px){
#serviceArea .areaInner .serviceContent ul li .img{
width: 100px;
}
}
#serviceArea .areaInner .serviceContent ul li .img img{
width:100%;
height:auto;
}
#serviceArea .areaInner .serviceContent ul li .charge{
line-height: 1;
margin-bottom: 15px;
}
@media screen and (max-width:767px){
#serviceArea .areaInner .serviceContent ul li .charge{
margin-left: 130px;
}
}
@media screen and (max-width:374px){
#serviceArea .areaInner .serviceContent ul li .charge{
margin-left: 115px;
}
}
#serviceArea .areaInner .serviceContent ul li .charge .yen{
font-size: 271.5%;
}
@media screen and (max-width:1100px){
#serviceArea .areaInner .serviceContent ul li .charge .yen{
font-size: 250%;
}
}
@media screen and (max-width:980px){
#serviceArea .areaInner .serviceContent ul li .charge .yen{
font-size: 185.5%;
}
}
@media screen and (max-width:767px){
#serviceArea .areaInner .serviceContent ul li .charge .yen{
font-size: 16pt;
}
}
@media screen and (max-width:374px){
#serviceArea .areaInner .serviceContent ul li .charge .yen{
font-size: 15pt;
}
}
#serviceArea .areaInner .serviceContent ul li .charge .number{
font-size: 414.5%;
letter-spacing: -0.01em;
}
@media screen and (max-width:1100px){
#serviceArea .areaInner .serviceContent ul li .charge .number{
font-size: 350%;
}
}
@media screen and (max-width:980px){
#serviceArea .areaInner .serviceContent ul li .charge .number{
font-size: 271.5%;
}
}
@media screen and (max-width:767px){
#serviceArea .areaInner .serviceContent ul li .charge .number{
font-size: 26pt;
}
}
@media screen and (max-width:374px){
#serviceArea .areaInner .serviceContent ul li .charge .number{
font-size: 25pt;
}
}
#serviceArea .areaInner .serviceContent ul li .charge .kara{
font-size: 243%;
position: relative;
top: -5px;
right: -5px;
}
@media screen and (max-width:1100px){
#serviceArea .areaInner .serviceContent ul li .charge .kara{
font-size: 200%;
}
}
@media screen and (max-width:980px){
#serviceArea .areaInner .serviceContent ul li .charge .kara{
font-size: 157%;
right: -3px;
}
}
@media screen and (max-width:767px){
#serviceArea .areaInner .serviceContent ul li .charge .kara{
font-size: 13pt;
}
}
@media screen and (max-width:374px){
#serviceArea .areaInner .serviceContent ul li .charge .kara{
font-size: 12pt;
}
}
#serviceArea .areaInner .serviceContent ul li .hour{
font-size: 114.5%;
line-height: 30px;
background: #6ea8c5;
height: 30px;
color: #fff;
margin: 0 9%;
}
@media all and (-ms-high-contrast:none) {
#serviceArea .areaInner .serviceContent ul li .hour{
height: 23px;
padding: 2px 0 5px;
}
}
@media screen and (max-width:980px){
#serviceArea .areaInner .serviceContent ul li .hour{
font-size: 100%;
}
}
@media screen and (max-width:767px){
#serviceArea .areaInner .serviceContent ul li .hour{
margin: 0 auto;
text-align: center;
width: 90%;
font-size: 10pt;
line-height: 26px;
height: 26px;
}
}
#serviceArea .areaInner .serviceContent ul li .note{
position:absolute;
top:100%;
line-height:1.4;
margin-top:5px;
font-size: 85.7%;
}
@media screen and (max-width:767px){
#serviceArea .areaInner .serviceContent ul li .note{
font-size:7pt;
margin-top:2px;
}
}

/*---------------------------------------*/
/* stepArea */
/*---------------------------------------*/
#stepArea {
padding:160px 0 165px;
}
@media screen and (max-width:980px){
#stepArea {
padding:80px 0;
}
}
@media screen and (max-width:767px){
#stepArea {
padding:50px 0;
}
}
#stepArea .areaTtl-jp{
margin-bottom: 180px;
}
@media screen and (max-width:980px){
#stepArea .areaTtl-jp{
margin-bottom: 45px;
}
}
@media screen and (max-width:767px){
#stepArea .areaTtl-jp{
margin-bottom: 30px;
}
}
#stepArea ul{
border-left:1px solid #6ea8c5;
border-right:1px solid #6ea8c5;
}
@media screen and (max-width:980px){
#stepArea ul{
border:none;
max-width:400px;
margin:0 auto;
}
}
#stepArea ul li{
width:25%;
float:left;
border-left:1px solid #6ea8c5;
margin-left:-1px;
text-align:center;
position:relative;
}
@media screen and (max-width:980px){
#stepArea ul li{
width:100%;
border-left:none;
margin-left:0;
margin-bottom:20px;
padding-bottom:20px;
border-bottom:1px solid #6ea8c5;
}
}
#stepArea ul li:first-child{
border-left:none;
}
#stepArea ul li .step{
position:relative;
font-size:143%;
padding-bottom:7px;
margin-bottom:15px;
color:#6ea8c5;
letter-spacing: 0.08em;
}
@media screen and (max-width:980px){
#stepArea ul li .step{
margin-bottom:15px;
}
}
@media screen and (max-width:767px){
#stepArea ul li .step{
font-size:12pt;
}
}
#stepArea ul li .step:after{
content:"";
display:block;
position:absolute;
bottom:0;
left:50%;
width:20px;
height:1px;
background:#6ea8c5;
margin-left:-10px;
}
#stepArea ul li .iconOuter{
margin:0 auto 25px;
}
@media screen and (max-width:980px){
#stepArea ul li .iconOuter{
position:absolute;
top:50px;
left:0;
}
}
@media screen and (max-width:767px){
#stepArea ul li .iconOuter{
top:35px
}
#stepArea ul li:first-child .iconOuter{
top:46px
}
}
#stepArea ul li .iconOuter .icon{
font-size: 75px;
color: #6ea8c5;
}
@media screen and (max-width:767px){
#stepArea ul li .iconOuter .icon{
font-size: 45px;
}
}
#stepArea ul li .iconOuter .icon img{
width:100%;
height:auto;
}
#stepArea ul li .ttl{
font-size:128.5%;
text-align:center;
line-height:1.7;
height:3.3em;
margin-bottom:15px;
}
@media screen and (max-width:767px){
#stepArea ul li .ttl{
font-size:14pt;
text-align:left;
margin-left:60px;
margin-top: -7px;
margin-bottom:10px;
height:35px;
line-height: 1.4;
}
#stepArea ul li:first-child .ttl{
height:55px;
}
}
@media screen and (max-width:374px){
#stepArea ul li .ttl{
font-size:13pt;
}
}
#stepArea ul li .note{
padding:0 15%;
line-height:1.7;
text-align:left;
}
@media screen and (max-width:767px){
#stepArea ul li .note{
font-size:10pt;
padding:0;
}
}
#stepArea ul li .tel{
padding:10px 0;
}
@media screen and (max-width:980px){
#stepArea ul li .tel{
text-align:left;
padding:10px 15% 0;
}
}
@media screen and (max-width:767px){
#stepArea ul li .tel{
text-align:left;
padding:10px 0 0;
}
}
#stepArea ul li .tel .icon-tel-2{
font-size:28px;
margin-right:5px;
color: #6ea8c5;
position: relative;
top: 3px;
}
@media screen and (max-width:767px){
#stepArea ul li .tel .icon-tel-2{
font-size:32px;
}
}
#stepArea ul li .tel .oswald{
font-size:178.5%;
line-height:1;
}
@media screen and (max-width:767px){
#stepArea ul li .tel .oswald{
font-size:215%;
}
}
#stepArea ul li .arrow{
position:absolute;
background: url(../images/common/icon-arrow.png) no-repeat;
background-size: contain;
width: 25px;
height: 53px;
top:50%;
right:0;
margin:-26px -12px 0 0;
z-index:10;
}
@media screen and (max-width:980px){
#stepArea ul li .arrow{
top:auto;
bottom:0;
right:50%;
margin:0 -12px -30px 0;
transform: rotate(90deg);
}
}
@media screen and (max-width:767px){
#stepArea ul li .arrow{
width: 20px;
height: 42px;
margin:0 -10px -24px 0;
transform: rotate(90deg);
}
}

/*---------------------------------------*/
/* faqArea */
/*---------------------------------------*/
#faqArea{
padding:180px 0 40px;
}
@media screen and (max-width:980px){
#faqArea{
padding:80px 0 40px;
}
}
@media screen and (max-width:767px){
#faqArea{
padding:50px 0 20px;
}
}
#faqArea .areaTtl-jp{
margin-bottom: 85px;
}
@media screen and (max-width:980px){
#faqArea .areaTtl-jp{
margin-bottom: 45px;
}
}
@media screen and (max-width:767px){
#faqArea .areaTtl-jp{
margin-bottom: 30px;
}
}
#faqArea .faqBox{
margin:0 auto 75px;
max-width:800px;
}
@media screen and (max-width:767px){
#faqArea .faqBox{
margin-bottom:40px;
}
}
#faqArea #faqtab{
position: relative;
height: 72px;
border-bottom: 2px solid #6ea8c5;
margin-bottom: 52px;
}
@media screen and (max-width:767px){
#faqArea #faqtab{
height: 62px;
margin-bottom: 32px;
}
}
#faqArea #faqtab li{
position: absolute;
width: 50%;
bottom: 0;
cursor: pointer;
}
#faqArea #faqtab li.payment{
left: 0;
}
#faqArea #faqtab li.work{
right: 0;
}
#faqArea #faqtab li .txt{
display: block;
line-height: 1.4;
border: 1px solid #6ea8c5;
border-radius: 10px 10px 0 0 ;
text-align: center;
font-size: 150%;
color: #6ea8c5;
padding: 15px 0;
}
@media all and (-ms-high-contrast:none) {
#faqArea #faqtab li .txt{
padding: 19px 0 11px;
}
}
@media screen and (max-width:980px){
#faqArea #faqtab li .txt{
font-size: 143%;
}
}
@media screen and (max-width:767px){
#faqArea #faqtab li .txt{
font-size: 10pt;
padding: 6px 0;
}
}
#faqArea #faqtab li.select .txt{
color: #fff;
background-color: #6ea8c5;
padding: 20px 0;
font-size: 164.5%;
}
@media all and (-ms-high-contrast:none) {
#faqArea #faqtab li .txt{
padding: 25px 0 15px;
}
}
@media screen and (max-width:980px){
#faqArea #faqtab li.select .txt{
font-size: 150%;
}
}
@media screen and (max-width:767px){
#faqArea #faqtab li.select .txt{
font-size: 11pt;
padding: 8px 0;
}
}
#faqArea .faqOuter.hide{
display: none;
}
.faqContent{
position:relative;
margin-bottom:46px;
}
@media screen and (max-width:767px){
#faqArea .faqContent{
margin-bottom:30px;
}
}
#faqArea .faqContent .txt .question{
position:relative;
font-size:150%;
background:#e6f0f5;
padding:9px 45px 9px 90px;
margin-bottom:22px;
line-height:1.6;
cursor:pointer;
}
@media all and (-ms-high-contrast:none) {
#faqArea .faqContent .txt .question{
padding:9px 45px 0 90px;
}
}
@media screen and (max-width:767px){
#faqArea .faqContent .txt .question{
font-size:10pt;
margin-bottom:15px;
padding:8px 30px 8px 48px;
}
}
#faqArea .faqContent .txt .question:before,
#faqArea .faqContent .txt .question:after{
position:absolute;
top:50%;
right:20px;
width:24px;
height:2px;
background:#6ea8c5;
margin-top:-1px;
content:"";
}
@media screen and (max-width:767px){
#faqArea .faqContent .txt .question:before,
#faqArea .faqContent .txt .question:after{
right:10px;
width:12px;
}
}
#faqArea .faqContent .txt .question:after{
-webkit-transform: rotate(90deg);
transform: rotate(90deg);
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
#faqArea .faqContent .txt .question.open:after{
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
#faqArea .faqContent .txt .question .num{
position:absolute;
top:-2px;
left:18px;
width:52px;
height:52px;
line-height:52px;
color:#6ea8c5;
text-align:center;
font-size: 171.5%;
}
@media all and (-ms-high-contrast:none) {
#faqArea .faqContent .txt .question .num{
top:-7px;
}
}
@media screen and (max-width:767px){
#faqArea .faqContent .txt .question .num{
width:40px;
height:40px;
line-height:40px;
left:4px;
font-size: 19pt;
}
}
#faqArea .faqContent .txt .answer{
font-size:114.5%;
line-height:1.6;
display:none;
padding:0 45px 0 90px;
}
@media screen and (max-width:767px){
#faqArea .faqContent .txt .answer{
font-size:10pt;
padding:0 25px;
}
}
#faqArea .faqContent .txt .answer .small{
font-size:87.5%;
}
@media screen and (max-width:767px){
#faqArea .faqContent .txt .answer .small{
font-size:9pt;
}
}
#faqArea .faqContent .txt div.answer p{
margin-bottom: 5px;
}
#faqArea .faqContent .txt .answer .list{
margin-left: 1em;
line-height: 1.4;
margin-bottom: 5px;
}
#faqArea .faqContent .txt .answer .list .dot{
display: inline-block;
width: 1em;
text-align: center;
margin-left: -1em;
}
/*---------------------------------------*/
/* placeArea */
/*---------------------------------------*/
#placeArea {
padding:190px 0 120px;
background: rgba(230, 240, 245, 0.3);
}
@media screen and (max-width:980px){
#placeArea {
padding:80px 0;
}
}
@media screen and (max-width:767px){
#placeArea {
padding:50px 0;
}
}
#placeArea .areaTtl-jp{
margin-bottom: 90px;
}
@media screen and (max-width:980px){
#placeArea .areaTtl-jp{
margin-bottom: 45px;
}
}
@media screen and (max-width:767px){
#placeArea .areaTtl-jp{
margin-bottom: 30px;
}
}
#placeArea .map{
max-width:800px;
margin:0 auto 50px;
}
@media screen and (max-width:767px){
#placeArea .map{
margin:0 auto 20px;
}
}
#placeArea .map img{
width:100%;
height:auto;
}
#placeArea .mapContent{
position:relative;
margin:0 auto 65px;
max-width:800px;
}
@media screen and (max-width:767px){
#placeArea .mapContent{
margin:0 auto 20px;
}
}
#placeArea .mapContent .ttl{
font-size:128.5%;
font-weight:bold;
color:#6ea8c5;
border-bottom: 2px solid #6ea8c5;
padding-bottom: 11px;
margin-bottom: 10px;
}
@media screen and (max-width:767px){
#placeArea .mapContent .ttl{
font-size:11pt;
padding-bottom: 8px;
margin-bottom:5px;
}
}
#placeArea .mapContent .note{
line-height:1.9;
}
@media screen and (max-width:767px){
#placeArea .mapContent .note{
font-size:9pt;
margin-bottom:10px;
line-height:1.8;
}
}