body{
padding: 72px 0 0 0;
font-family: "Helvetica Neue",
    Arial,
    "Hiragino Kaku Gothic ProN",
    "Hiragino Sans",
    Meiryo,
    sans-serif;
}
.wrap{
width: 1200px;
margin: 0 auto;
}
body > section{
padding: 3vw 0;
}

/*-----------------------
 header
-------------------------*/
header{
background-color: #fff;
box-shadow: 0 3px 3px rgba(0,0,0,0.1);
z-index: 999;
position: fixed;
top: 0;
left: 0;
width: 100%;
}
header .wrap{
display: flex;
  align-items: center;
justify-content: space-between;
padding: 1em 0;
}
header .wrap .logos{
	display:flex;
	justify-content:flex-start;
	align-items: center;
}
header .wrap .logos img{
width: auto;
height: 40px;
margin-right: 1em;
}
header .wrap .logos a{
font-size: 1.8rem;
font-weight: bold;
margin-right: 2em;
}
header .wrap .logos h1{
font-size: 1.4rem;
font-weight: bold;
}

header .wrap .telmail{
	display:flex;
	justify-content:flex-end;
	align-items: center;
    font-weight: bold;
}
header .wrap .telmail a.mail{
background-color: #d0002c;
color: #fff;
padding: 1em 3em;
border: 1px solid #d0002c;
border-radius: 1em;
box-shadow:3px 3px 3px rgba(208,0,44,0.5);
margin-left: 1.5em;
}
header .wrap .telmail a.mail:hover{
background-color: #fff;
color:#d0002c; 
}

header .wrap .telmail a.tel{
font-size: 2rem;
color: #d0002c;
letter-spacing: 2px;
}
header .wrap .telmail img{
display: none;
}


/*-----------------------
 mv
-------------------------*/
.mv .wrap{
display: flex;
  justify-content:space-between;
  align-items:stretch;
}
.mv .wrap > div{
padding:0 1.5vw;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.mv .wrap .left{
width: 55%;
text-align: center;
line-height:2;
}
.mv .wrap .right{
width: 45%;
}
.mv .wrap .left .catch{
color: #147be5;
font-weight: bold;
font-size: 3rem;
margin-bottom:0.25em;
}
.mv .wrap .left .catch strong{
padding:0.125em 0.25em;
border-bottom: 1px solid #147be5;
}
.mv .wrap .left h2{
font-size: 3.6rem;
font-weight: bold;
letter-spacing: 2px;
}
.mv .wrap .left h2 strong{
font-size: 6rem;
}
.mv .wrap .left .read{
font-size:2.4rem;
font-weight: bold;
margin-bottom: 2em;
}
.mv .wrap .left .read strong{
color: #147be5;
}
.mv .wrap .left h3{
font-size: 2.4rem;
font-weight: bold;
margin-bottom: 1.5em;
}
.mv .wrap .left h3 strong{
background-color: #147be5;
color: #fff;
padding: 0.25em 1.5em;
}
.mv .wrap .left section ul{
display: flex;
  justify-content:space-between;
  align-items:flex-start;
    -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
.mv .wrap .left section ul li{
width: 48%;
height: 60px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
border: 3px solid rgba(17,147,212,0.35);
	display:flex;
	justify-content:center;
	align-items: center;
    margin-bottom: 1em;
    line-height: 1.5;
    text-align: left;
    letter-spacing: 1px;
}
.mv .wrap .left section ul li .blue{
color: #147be5;
font-weight: bold;
font-size: 1.7rem;
padding-left: 0.25em;
}
.mv .wrap .left section ul li .blue strong{
font-size: 3.7rem;
}
.mv .wrap .left section ul li .blue span{
font-size: 2rem;
}
.mv .wrap .left section .indm {
  text-indent: -1em;
  margin:1em 0 0.5em 2em;
  font-size: 1.6rem;
}

.mv .wrap .right form{
width: 100%;
height: 100%;
border-radius: 2em;
background-color: #fbebee;
padding: 1em 2.5em;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
line-height: 2;
}
.mv .wrap .right form h3{
width: 100%;
text-align: center;
font-size: 2rem;
padding: 0.125em 0;
margin-bottom: 1em;
color: #d0002c;
font-weight: bold;
border-top: 1px solid #d0002c;
border-bottom: 1px solid #d0002c;
}
.mv .wrap .right form dd{
margin-bottom:0.5em;
}
.mv .wrap .right form dd input[type="mail"],
.mv .wrap .right form dd input[type="text"]{
padding:0.5em;
width: 80%;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
font-size: 16px;
}
.mv .wrap .right form dd input[type="mail"]{
width: 100%;
}
.mv .wrap .right form dd input[type="text"].short{
width: 40%;
margin-right: 0.5em;
}
.mv .wrap .right form dd input[type="radio"]{
display: none;
}
.mv .wrap .right form dd label{
border: 1px solid #999;
padding: 0.5em 1em;
background-color: #fff;
margin-right: 0.5em;
cursor: pointer;
}
.mv .wrap .right form dd input[type="radio"]:checked + label,
.mv .wrap .right form dd label:hover{
background-color:#F2F2F2;
}

.mv .wrap .right form .submit{
text-align: center;
margin-top: 1em;
}
.mv .wrap .right form .submit button{
color: #fff;
padding: 0.5em 3em;
background-color: #d0002c;
border: 1px solid #d0002c;
border-radius: 1.5em;
cursor: pointer;
}
.mv .wrap .right form .submit button:hover{
background-color:#fff;
color: #d0002c;
}
.mv .wrap .right form .txtC{
margin-top:0.25em;
}
.mv .wrap .right form .txtC a{
font-size: 1rem;
font-weight: bold;
color: #848484;
text-decoration: underline;
}

::placeholder {
  color:#ccc;
}


/*-----------------------
 chigai
-------------------------*/
section.chigai{
padding: 0 ;
}
section.chigai .upper{
padding: 2vw 0;
background-color:#edf5fd;
}
section.chigai h2{
text-align: center;
font-size: 3rem;
font-weight: bold;
margin-bottom: 1em;
}
section.chigai ul{
display: flex;
  justify-content:space-between;
  align-items: center;
}
section.chigai ul li{
text-align: center;
line-height: 2;
font-size: 1.6rem;
}
section.chigai ul li strong{
font-size: 2.4rem;
font-weight: bold;
color: #147be5;
}
section.chigai ul li img{
margin-bottom: 0.5em;
}
section.chigai .upper p.txtC{
margin-top:2em;
font-size: 1.8rem;
text-decoration: underline;
}

section.chigai .under{
padding:3vw 0;
background-color: #fff;
line-height: 2;
}
section.chigai .under table{
border-collapse:collapse;
border-spacing:0;
empty-cells:show;
width:90%;
margin: 0 auto;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
section.chigai .under table th,
section.chigai .under table td{
padding: 1em;
border: 1px solid #ddd;
text-align: center;
font-size: 1.5rem;
}
section.chigai .under table th{
background-color:#edf5fd;
font-size: 2rem;
font-weight:300;
}
section.chigai .under table th strong{
font-size: 2.75rem;
color: #172397;
font-weight: bold;
}

section.chigai .under table td:nth-of-type(2){
color: #ba1c21;
font-weight: bold;
border-left: 10px solid #147be5;
border-right: 10px solid #147be5;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
section.chigai .under table th:nth-of-type(2){
border-top: 10px solid #147be5;
border-left: 10px solid #147be5;
border-right: 10px solid #147be5;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
section.chigai .under table tr:nth-last-of-type(1) td:nth-of-type(2){
border-bottom:10px solid #147be5;
}

/*-----------------------
 aside.tomail
-------------------------*/
aside.tomail{
padding: 1.5vw 0;
background-color: #fbebee;
text-align: center;
}
aside.tomail h2{
font-size: 2.4rem;
margin-bottom: 0.5em;
}
aside.tomail ul{
display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 1.5em;
}
aside.tomail ul li{
padding:1em 0;
width: 330px;
height:auto;
display: flex;
  justify-content: center;
  align-items: center;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
      line-height: 1.5;
}
aside.tomail ul li:nth-of-type(1){
border-right: 2px solid #ccc;
}

aside.tomail ul li p{
width: 100%;
}
aside.tomail ul li p a{
font-size: 3rem;
letter-spacing: 1px;
}
aside.tomail ul li a.mail{
background-color: #d0002c;
color: #fff;
padding: 0.75em 3.5em;
border: 1px solid #d0002c;
border-radius: 1.5em;
box-shadow:3px 3px 3px rgba(208,0,44,0.5);
margin-left: 1.5em;
}
aside.tomail ul li a.mail:hover{
background-color: #fff;
color:#d0002c; 
}

/*-----------------------
 whats
-------------------------*/
section.whats .wrap{
line-height: 2.5;
}
section.whats h2{
font-size: 3rem;
font-weight: bold;
text-align: center;
}
section.whats p.txtC{
font-size: 2rem;
}
section.whats .text{
width: 55%;
}
section.whats img{
margin:0 5% 0 3em;
}
section.whats .under{
margin-top: 2em;
display: flex;
  justify-content:space-around;
  align-items: center;
}

/*-----------------------
 merit
-------------------------*/
section.merit{
background-color: #ececec;
}
section.merit h2{
font-size: 3rem;
font-weight: bold;
text-align: center;
margin-bottom: 2em;
}
section.merit .under{
display: flex;
  justify-content:space-between;
  align-items: center;
}
section.merit .under div.left{
width:40%;
min-height: 279px;
background-image: url("../images/merit_b.png");
background-repeat: no-repeat;
background-size: auto 100%;
background-position: center center;
}
section.merit .under div.text{
width:58%;
line-height: 2;
font-size: 2rem;
font-weight: bold;
}
section.merit .under div.text p{
text-indent: -6em;
margin-left: 6em;
}
section.merit .under div.text p strong{
color: #147be5;
padding-right: 1em;
}


/*-----------------------
 qanda
-------------------------*/
section.qanda h2{
font-size: 3rem;
font-weight: bold;
text-align: center;
}
section.qanda dl{
width: 100%;
margin:4em auto;
max-width: 970px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
line-height:1.5;
}
section.qanda dl dt{
color: #ba1c21;
font-size: 1.8rem;
font-weight: bold;
padding:0.5em 0 0.5em 3em;
position: relative;
margin-bottom: 1em;
letter-spacing: 2px;
}
section.qanda dl dt:before{
content: "Q";
font-size: 3.6rem;
top: -0.125em;
left: 0;
position: absolute;
}
section.qanda dl dd{
color: #000;
font-size: 1.8rem;
font-weight: bold;
position: relative;
padding:0 0 1em 3em;
margin-bottom: 1em;
border-bottom: 2px solid #ccc;
letter-spacing: 2px;
}
section.qanda dl dd:before{
content: "A";
font-size: 3.6rem;
top: -0.125em;
left: 0;
position: absolute;
}


/*-----------------------
 nagare
-------------------------*/
section.nagare{
background-color: #edf5fd;
}
section.nagare h2{
font-size: 3rem;
font-weight: bold;
text-align: center;
margin-bottom: 1em
}

section.nagare ul{
width: 100%;
max-width: 700px;
margin: 3em auto;
}
section.nagare ul li{
width: 100%;
background-color: #fff;
border:2px solid #0581d6;
margin-bottom: 2em;
position: relative;
padding:1.5em 1.5em 1.5em 6em;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
    line-height: 1.5;
    font-size: 1.4rem;
    letter-spacing: 1px;
}
section.nagare ul li:after{
content: "";
display: block;
position: absolute;
bottom:-25px;
left:50%;
transform: translateX(-50%); 
  width: 0;
  height: 0;
  border-right:25px solid transparent;
  border-top:25px solid #0581d6;
  border-left:25px solid transparent;
}
section.nagare ul li:nth-last-of-type(1):after{
display: none;
}

section.nagare ul li h3{
font-size: 2rem;
color: #0581d6;
font-weight: bold;
margin-bottom:0.5em;
}
section.nagare ul li div.step{
position: absolute;
top: 0;
left: 5px;
width: 53px;
height: 70px;
color: #fff;
text-align: center;
padding: 0.25em 0 0 0;
font-weight: bold;
line-height: 1;
background-image: url("../images/un_arrow.svg");
background-repeat: no-repeat;
background-size: 100% 100%; 
}
section.nagare ul li div.step strong{
display: block;
font-size: 3rem;
}



/*-----------------------
 thanks
-------------------------*/
section.thanks{
line-height:2;
text-align: center;
}
section.thanks h2{
font-size: 2rem;
font-weight: bold;
margin: 3em 0;
}
section.thanks p{
margin-bottom: 3em;
}



/*-----------------------
 page-top
-------------------------*/
#page-top{
	width:40px;
	height:40px;
	display:block;
	position:fixed;
	right:5%;
	bottom:5%;
	cursor:pointer;
	  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all  0.3s ease;
  z-index:998;
}
#page-top img{
	width:40px;
	height:40px;
}
#page-top:hover{
	opacity:0.8;
}



/*-----------------------
 footer
-------------------------*/
footer{
background-color: #f5f5f5;
padding:2vw 0; 
}
footer .wrap{
	display:flex;
	align-items:flex-start;
    justify-content: space-between;
    line-height:2;
}
footer .f_logo{
text-align: center;
}
footer .f_logo img{
width: auto;
height: auto;
max-height: 40px;
}

footer .f_logo .tels {
  display: flex;
  justify-content:center;
}
footer .left{
max-width:750px;
}
footer .left .copy{
margin-top: 2em;
font-size: 1.2rem;
}
footer nav ul{
	display:flex;
	justify-content:flex-start;
	align-items:flex-start;
      -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}

footer nav ul a{
display: block;
min-width: 8em;
padding:0 3em 0 0;
}
footer nav ul a:before{
content: "-";
margin-right: 0.5em;
}
footer nav ul a:hover{
text-decoration: underline;
}
a.logo{
font-size: 2.2rem;
	display:flex;
	justify-content:flex-start;
	align-items: center;
    font-weight: bold;
}
a.logo img{
width: auto;
height: 3.4rem;
margin-right: 0.5em;
}
.tels a{
	display:flex;
	justify-content:flex-start;
	align-items: center;
    font-weight: bold;
    font-size:2.2rem;
    letter-spacing:3px;
}
.tels a img{
width: auto;
height: 2.4rem;
margin-right: 0.25em;
}
.tels p{
font-size: 1rem;
margin-top: 0.5em;
letter-spacing:0.5px;
}

/*---------------------------------------------*
* width 1200px
*----------------------------------------------*/
@media screen and (max-width:1200px) {

body{
padding-top: 64px;
}
body > section {
  padding:6vw 0;
}
.wrap{
width: 96%;
}
header .wrap {
  padding:0.5em 0;
}

section.chigai .under table {
    width:100%;
}
section.whats .text {
  width:60%;
}
section.whats img{
width: 100%;
max-width:240px;
height: auto;
}

.mv .wrap {
  display: flex;
  justify-content: space-between;
  align-items:flex-start;
    -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
.mv .wrap .right,
.mv .wrap .left {
  width:100%;
}

.mv .wrap .left section ul {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  max-width: 700px;
  margin: 0 auto;
}
.mv .wrap .right form {
  width: 100%;
  height: 100%;
  max-width: 700px;
  margin: 0 auto;  
}

section.chigai .upper {
  padding:6vw 0;
}
section.chigai ul {
  display: flex;
  justify-content:center;
  align-items: center;
    -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
section.chigai ul li{
width: 50%;
margin-bottom: 1em;
}
section.chigai .upper p.txtC {
  margin-top: 2em;
  line-height: 1.5;
  font-size: 1.6rem;
  text-decoration: underline;
}

section.merit .under div.text{
line-height:1.5;
}
section.merit .under div.left {
  min-height:23vw;
}
}
/* width 1200px end --------------------------------------------*/

/*---------------------------------------------*
* width 1000px
*----------------------------------------------*/
@media screen and (max-width:1000px) {

header .wrap .telmail a span{
display: none;
}
header .wrap .telmail img{
display:block;
}
header .wrap .telmail a.mail {
  background-color:transparent;
  color: #fff;
  padding:0;
  border:none;
  border-radius:none;
  box-shadow:none;
  margin-left: 1.5em;
}
.sc{
position: relative;
width: 100%;
overflow-x: auto;
padding:2em 0;
}
.sc:before{
position: absolute;
content: "スクロール→";
color: #999;
font-size: 1.2rem;
right: 1em;
top: 0;
}

section.chigai .under table{
min-width:900px;
}
section.chigai .under table th, section.chigai .under table td {
  padding:0.25em 0.5em;
  font-size: 1.4rem;
}

section.whats .under {
  margin-top: 2em;
  display: flex;
  justify-content: space-around;
  align-items: center;
    -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
section.whats .text {
  width:100%;
  margin-bottom: 1em;
}

section.merit .under {
  display: flex;
  justify-content: space-between;
  align-items: center;
    -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
section.merit .under div.text,
section.merit .under div.left {
width: 100%;
max-width: 700px;
margin: 0 auto;
}
section.merit .under div.left{
min-height:23vw;
margin-bottom: 2em;
}

footer .left {
  max-width:65%;
}

.tels p,
.tels a span{
display: none;
}
.tels a img {
  width: auto;
  height:30px;
  margin-right: 0.5em;
}

}
/* width 1000px end --------------------------------------------*/

/*---------------------------------------------*
* width 768px
*----------------------------------------------*/
@media screen and (max-width:768px) {


}
/* width 768px end --------------------------------------------*/

/*---------------------------------------------*
* width 640px
*----------------------------------------------*/
@media screen and (max-width:640px) {
body {
  padding-top:52px;
}
body > section {
  padding:10vw 0;
}
header .wrap .logos{
width: 60%;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
header .wrap .logos a {
  font-size: 1.6rem;
  margin-right:0;
  width: 100%;
  -webkit-box-ordinal-group:2;
-ms-flex-order:2;
-webkit-order:2;
order:2;
}
header .wrap .logos h1{
font-size: 1.2rem;
-webkit-box-ordinal-group:1;
-ms-flex-order:1;
-webkit-order:1;
order:1;
margin-bottom: 0.25em;
}
header .wrap .logos img {
  width: auto;
  height:30px;
  margin-right:0.5em;
}
header .wrap .telmail img {
  width: auto;
  height:30px;
}
header .wrap {
  padding: 0.25em 0;
}

.mv .wrap > div {
  padding: 0;
}
.mv .wrap .left .catch {
  font-size:1.6rem;
}
.mv .wrap .left h2 {
  font-size:1.8rem;
  letter-spacing:0;
}
.mv .wrap .left h2 strong{
font-size: 2.4rem;
}
.mv .wrap .left .read {
  font-size:1.6rem;
}

.mv .wrap .left h3 {
  font-size:1.8rem;
}
.mv .wrap .left section ul{
  justify-content: center;
}

.mv .wrap .left section ul li {
  width:70%;
  height:auto;
  min-height: 60px;
}

.mv .wrap .left section ul li .blue {
  font-size: 1.6rem;
}
.mv .wrap .left section ul li .blue strong {
  font-size:2.4rem;
}
.mv .wrap .left section .indm {
  text-indent: -1em;
  margin: 1em 0 1em 1em;
  font-size: 1.3rem;
}
.mv .wrap .right form {
  border-radius:1em;
  padding: 1em;
}

section.chigai h2 {
  font-size:2rem;
}

section.chigai ul{
  justify-content: center;
}
section.chigai ul li {
  width:90%;
  margin-bottom:2em;
}
section.chigai ul li br{
display: none;
}
section.chigai ul li p:nth-last-of-type(1){
text-align: left;
line-height: 1.5;
}

section.chigai .upper p.txtC {
  font-size: 1.4rem;
text-align: left;
}

aside.tomail {
  padding:6vw 0;
}

aside.tomail h2 {
  font-size:1.8rem;
}

aside.tomail ul {
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
      margin-top: 0;
}
aside.tomail ul li {
  padding:1.5em 0 0 0;
  width:100%;
}
aside.tomail ul li:nth-of-type(1) {
  border-right:none;
}
aside.tomail ul li a.mail {
  margin-left:0;
}
section.whats .wrap {
  line-height: 1.5;
}
section.whats h2 {
  font-size:2rem;
}
section.whats p.txtC {
  font-size:1.6rem;
}

section.whats img {
  width: 100%;
  max-width: 200px;
  height: auto;
}
section.whats img {
  margin: 0 auto;
}

section.merit h2 {
  font-size:2rem;
}

section.merit .under div.left {
  min-height:46vw;
  margin-bottom: 2em;
}
section.merit .under .text {
  line-height:1.5;
  font-size:1.6rem;
 }
 
section.merit .under div.text p{
text-indent:0;
margin: 0 0 1em 0;
font-size: 1.6rem;
}
section.merit .under div.text p strong {
  padding-right:0;
  display: block;
  width: 100%;
}

section.qanda h2{
font-size: 2rem;
}
section.nagare h2{
font-size: 2rem;
}

section.qanda dl dt::before,
section.qanda dl dd::before {
  font-size:2rem;
  top: 0;
}
section.qanda dl dd,
section.qanda dl dt {
font-size: 1.4rem;
padding-left: 2em;
padding: 0 0 1em 2em;
}

section.nagare ul li {
  width: 100%;
  background-color: #fff;
  border: 2px solid #0581d6;
  margin-bottom: 2em;
  position: relative;
  padding:1em 1em 1em 5em;
}
section.nagare ul li h3 {
  font-size:1.8rem;
}
section.nagare ul li p br{
display: none;
}


footer {
  padding:10vw 0;
}
footer .wrap {
  line-height:1.5;
    -ms-flex-wrap: wrap-reverse;
      flex-wrap: wrap-reverse;
}
footer .f_logo {
width: 100%;
  text-align: center;
  margin-bottom:2em;
}
footer .f_logo a.logo {
  justify-content:center;
}
footer .f_logo .tels{
width: 100%;
  display: flex;
  justify-content: center;
  max-width:none;
}
footer .left {
  max-width:100%;
}
footer nav ul a {
  display: block;
  min-width: 8em;
  width: 100%;
  padding: 0 0 0 0;
}
footer nav ul li{
width:50%;
margin-bottom: 1em;
}

footer .left .copy {
text-align: center;
}
footer ul.sns {
  display: flex;
  justify-content:center;
  align-items: center;
  margin:2em 0 3em 0;
  clear: both;
}
a.logo {
  font-size:1.8rem;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  font-weight: bold;
}

}
/* width 640px end --------------------------------------------*/

/*---------------------------------------------*
* width 480px
*----------------------------------------------*/
@media screen and (max-width:480px) {
}
/* width 480px end --------------------------------------------*/

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