@charset "utf-8";

/*===============================================
 *	hd-ttl
===============================================*/
h1.hd-ttl {font-size: 18px;}
@media only screen and (max-width: 568px) {
h1.hd-ttl {font-size: 16px;}
}
/*===============================================
 *	main-wrapper
===============================================*/
@media only screen and (max-width: 568px){
.mainvisual-txtbox {padding-top: 2%;}
.hd-primary {margin-bottom: 5px;}
.cheapest-txt {margin-bottom: 5px;}
.visual-txtbox {margin-bottom: 10px;}
}
/*===============================================
 *	Questionnaire
===============================================*/
.questionnaire-box {max-width: 600px;}
@media only screen and (max-width: 768px) {
.questionnaire-box {max-width: 600px;}
.ttl-main_questionnaire span{font-size: 44px;}
}
@media only screen and (max-width: 568px) {
.ttl-main_questionnaire span {font-size: 24px;}
.questionnaire-box {max-width: 275px;}
}
/*===============================================
 *	Introductory sentence
===============================================*/
#introductory-wrap{background-image:url("../img/bg-introductory.png"),url("../img/bg-green_triangle.png");background-repeat:no-repeat,repeat;background-position:80%,top left;border-top: #c4e5d6 4px solid;border-bottom: #c4e5d6 4px solid;padding: 30px 0;}
.introductory-contents{max-width: 980px;margin: 0 auto;}
.introductory-txtbox{max-width: 670px;text-shadow: 1px 1px 0 #fff;}
.introductory-ttl{font-size: 32px;font-weight: bold;margin-bottom: 10px;letter-spacing: 1px;text-shadow: 1px 1px 0 #fff;}
.introductory-ttl em{color: #009db3;font-size: 42px;margin-bottom: 10px;}
@media only screen and (max-width: 768px) {
#introductory-wrap {background-position: 100%,top left;}
.introductory-contents {width: 90%;}
.introductory-txtbox {max-width: 470px;}
.introductory-ttl {font-size: 24px;line-height: 1.4;}
.introductory-ttl em {font-size: 28px;}
}
@media only screen and (max-width: 568px) {
#introductory-wrap {background-position: 100% top,top left;background-size: 170px,50%;}
}
/*===============================================
 *	staff-wrap
===============================================*/
#staff-wrap{max-width: 980px;margin: 0 auto;}
.staff-contents{display: flex;justify-content: space-between;flex-direction: row-reverse;align-items: flex-start;flex-wrap: wrap;}
.photo-staff{max-width: 260px;filter: drop-shadow(10px 10px 5px rgb(100, 100, 100));}
.staff-txtbox {max-width: 600px;}
.staff-txtbox h3{color: #009db3;font-size: 26px;font-weight: bold;line-height: 1.4;margin-bottom: 10px;}
@media only screen and (max-width: 768px) {
#staff-wrap {width: 90%;}
.photo-staff {max-width: 250px;}
.staff-txtbox {max-width: 430px;}
.staff-txtbox h3 {font-size: 26px;}
}
@media only screen and (max-width: 568px) {
.staff-contents{display: flex;justify-content: center;}
.staff-txtbox h3{font-size: 18px;}
.photo-staff {margin-bottom: 1.0em;max-width: 150px;filter: drop-shadow(5px 5px 5px rgb(100, 100, 100));}
}
/*===============================================
 *	branch-wrap
===============================================*/
#branch-wrap{max-width: 980px;margin: 0 auto 60px;padding-top: 60px;}
.frame-box {padding: 2%;margin-bottom: 40px;width: 96%;}
.branch-add,.branch-add > dt,.branch-add > dd {box-sizing: border-box;}
.branch-add > dt,.branch-add > dd {padding: .5em 1em;}
.branch-add > dt {background: #346bb6;color: #fff;}
.gmap {height: 500px;overflow: hidden;position: relative;}
.gmap iframe {position: absolute;left: 0;top: 0;height: 100%;width: 100%;}
.gmap iframe,.gmap object,.gmap embed {-webkit-filter: grayscale(100%);-moz-filter: grayscale(100%);-ms-filter: grayscale(100%);-o-filter: grayscale(100%);filter: grayscale(100%);-webkit-transition: all 0.7s ease;-moz-transition: all 0.7s ease;-o-transition: all 0.7s ease;transition: all  0.7s ease;}
.gmap iframe:hover,.gmap object:hover,.gmap embed:hover {-webkit-filter: grayscale(0%);-moz-filter: grayscale(0%);-ms-filter: grayscale(0%);-o-filter: grayscale(0%);filter: grayscale(0%);}
@media only screen and (min-width: 768px) {
.branch-add {display: flex;flex-wrap: wrap;}
.branch-add > dt,.branch-add > dd {display: flex;flex-direction: column;justify-content: center;}
.branch-add > dt {width: 20%;}
.branch-add > dd {width: 80%;}
.branch-add li {margin-bottom: 5px;}
.branch-add li a{text-decoration: underline;}
}
@media only screen and (max-width: 768px) {
#branch-wrap {padding-top: 30px;width: 90%;}
}
@media only screen and (max-width: 568px) {
#branch-wrap {margin: 0 auto 30px;}
.frame-box {margin-bottom: 20px;}
.branch-add > dt, .branch-add > dd {text-align: left;}
.gmap {height: 400px;}
}




.ttl-main_reason {
    font-size: 32px;
}
.ttl-main_reason span {
    font-size: 34px;
}
.ttl-main_reason span:first-of-type {
    display: block;
}
.ttl-main_reason span.gtxt, .ttl-main_reason span.ptxt {
    font-size: 42px;
}
@media only screen and (max-width: 768px) {
.ttl-main_reason {font-size: 29px;}
.ttl-main_reason span {font-size: 30px;}
.ttl-main_reason span.gtxt, .ttl-main_reason span.ptxt {font-size: 30px;}
}
@media only screen and (max-width: 568px) {
    .ttl-main_reason {
        font-size: 20px;
    }
    .ttl-main_reason span {
        font-size: 25px;
    }
    .ttl-main_reason span.gtxt, .ttl-main_reason span.ptxt {
        font-size: 25px;
    }
}