@charset "UTF-8";

@font-face {
  font-family: 'SnellRoundhand';
  src: url('./font/snell-roundhand.ttf') format('truetype');

  font-family: 'source-han-sans-japanese';
  src: url('./font/SourceHanSansJP-Regular.otf') format('opentype');

  font-family: 'ipaexm';
  src: url('./font/ipaexm.ttf') format('truetype');
}

@font-face{
  font-family: 'cotillion';
  src: url('./font/COTILLIO.ttf') format('truetype');
}

body{
  width: 100%;
  margin: 0 auto;
  text-align: center;
  background: #fff;
  font-family: 'ipaexm', sans-serif;
}

ol,ul{
  list-style: none;
}

h1.agent_title{
  text-align: left;
  color: #084f9f;
  text-shadow: 2px 3px 4px #808080;
  font-size: 3vw;
  width: 40%;
  padding: 5em 5em 0.5em 5em;
  margin-top: -15em;
  line-height: 1.8;
}

h2{
  font-size: 3vw;
}

h3{
  text-shadow: 2px 3px 4px #000;
}

/* ヘッダー */

.header_01{
  display: flex;
  position: fixed;
  background-color: white;
  width: 100%;
  height: 5em;
  top: 0;
  left: 0;
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, .5);
  z-index: 999;
  justify-content: space-between;
}

.logo{
  padding: 1em 2em;
}

.header01{
  display: flex;
  justify-content: space-between;
}

.header01 img{
  height: 17px;
  padding-top: 19px;
  padding-right: 1.4vw;
  margin: 0;
}

.header01 p{
  font-size: 1.2vw;
}
.menu_pc_right,.menu_pc_left{
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.menu_pc{
  display: flex;
  line-height: 1.0;
  padding: 1.67em;
}

.menu_pc a{
  padding: 0 1.2vw;
  color: #12365e;
  text-decoration: none;
  font-size: 1.3vw;
}

.menu_pc span{
  font-size: 0.6vw;
}

.sanka_smp,.setsumeikai_smp{
  display: none;
}

.sanka{
  color: #fff;
  background-color: #12365e;
  font-size: 1.3vw;
  padding: 5px 10px;
  border-radius: 5px;
  margin: 20px 10px 20px 20px;
  text-align: center;
  font-family: 'source-han-sans-japanese', sans-serif;
}

.sanka a{
  text-decoration: none;
  color: #fff;
  display: block;
  width: 13em;
}

.sanka a:visited{
  color: #fff;
}

.sanka a:after{
  color: #fff;
}

.top_smp{
  display: none;
}

/* top */

.main-visual{
  margin-top: 4em;
}

.main-visual img{
  margin: 0 -10px;
  padding: 0;
}

.main_pc{
  display: block;
}

.main_smp{
  display: none;
}

.shikaku{
  margin-left: 14.5vw;
}

.shikaku01,.shikaku02{
  display: flex;
}

.shikaku p{
  padding: 1px 3px;
  margin: 5px;
  background-color: #ff3254;
  border-radius: 1px;
  color: #fff;
  line-height: 1.8;
  text-shadow: 2px 3px 4px #808080;
  font-size: 1.8vw;
}

.setsumeikai,.setsumeikai_1{
  margin: 5em auto 0.9em auto;
}

.setsumeikai a,.setsumeikai_1 a{
  text-decoration: none;
  padding: 0.5em 5.5em;
  color: #fff; font-size: 1.8vw;
  background-color: #12365e;
  border-radius: 5px;
  text-align: center;
  width: 25em;
  font-family: source-han-sans-japanese, sans-serif;
}

/* message */

.message{
  margin-top: 8em;
}

.message p{
  font-size: 28px;
  text-shadow: 2px 3px 4px #808080;
  line-height: 2.3;
}

/* search */

.search{
  background-image: url(../imges/nayamiback.png);
  background-repeat: no-repeat;
  background-size: 100% auto;
  background-position: center;
}

.search_smp{
  display: none;
}

.search span{
  font-size: 4vw;
}

.search_pc01{
  display: flex;
}

.search_01{
  margin-left: 10%;
  padding-top: 30px;
}

.search_01 img{
  width: 90%;
}

.search_02{
  margin-top: 80px;
  margin-left: 50px;
}

.search_02 img{
  width: 90%;
}

.search_pc02 img{
  margin: -1.8vw auto 12vw -15%;
  width: 55%;
}

.search_pc{
  margin-top: 30px;
}

/* about */

.aboutsmp{
  display: none;
}

.about01{
  margin-bottom: 50px;
}

.about01 h2 img{
  width: 80%;
  max-width: 810px;
  display: block;
  margin: 0 auto;
}

.about01 h2{
  width: 100%;
  margin: 0;
  text-align: center;
}

.aboutpc_01 p{
  font-size: 2.8vw;
  color: #fff;
  margin: -34vw auto 0 15%;
  text-shadow: 2px 3px 4px #000;
  text-align: left;
  line-height: 1.9;
}

.aboutpc_01_1 p{
  font-size: 3.8vw;
  line-height: 1.2;
  color: #fff;
  text-shadow: 2px 3px 4px #000;
  text-align: left;
  margin: 0 auto 21px 15%;
}

.aboutpc_02 p{
  font-size: 3.9vw;
  color: #fff;
  margin: -30vw auto 0px 42%;
  text-shadow: 2px 3px 4px #000;
  text-align: left;
  line-height: 1.3;
}

.aboutpc_02_1 p{
  font-size: 2vw;
  line-height: 1.2;
  color: #fff;
  text-shadow: 2px 3px 4px #000;
  text-align: left;
  margin-top: 80px;
}

/* howtouse */

.howtouse{
  margin-top: 17vw;
}

.howtouse h2{
  font-size: 2.7vw;
  margin-bottom: 0;
  color: #12365e;
  font-family: 'SnellRoundhand','cotillion', sans-serif;
  font-weight: lighter;
}

.howtouse p{
  margin: 0;
  color: #12365e;
}

.howtouse01,.howtouse02,.howtouse03,.howtouse04{
  display: flex;
  width: 45%;
  margin: 2vw 0;
  align-items: center;
}
/*
.howtouse01 img,.howtouse02 img{
  width: 13%;
  height: 13%;
}

.howtouse03 img,.howtouse04 img{
  width: 25%;
  height: 25%;
}*/

.Step h3{
  font-size: 2vw;
  text-align: left;
  text-shadow: none;
  padding: 0;
  margin: 0;
  color: #12365e;
  font-family: 'SnellRoundhand','cotillion', sans-serif;
  font-weight: lighter;
}

.Step h4{
  font-size: 1.7vw;
  margin: 0;
}

.Step p{
  font-size: 1vw;
  color: #000;
}
.Step img{
  width: 25%;
  height: 25%;
}

.Step{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  width: 80%;
  margin: 3vw auto 8vw;
}

.step1,.step2,.step3,.step4{
  text-align: left;
  line-height: 1.8;
  margin-left: 20px;
}



/*.step1,.step2,.step3,.step4{
  text-align: left;
  line-height: 1.8;
  margin-left: 20px;
}

.howtouse01,.howtouse02{
  margin-left: 16%;
}

.howtouse03,.howtouse04{
  margin-left: 54%;
}

.howtouse03{
  margin-top: -453px;
}*/

/* explanatorymeeting */

.setsumei01{
  background-image: url(../imges/setsumeikaiback.jpg);
  background-repeat: no-repeat;
}

.setsumei01smp{
  display: none;
}

.setsumei01 h2{
  color: #fff;
  text-shadow: 2px 3px 4px #000;
}

.setsumei01 h3{
  color: #fff;
  font-size: 2vw;
  line-height: 1.0;
}

.setsumei01 span{
  text-shadow: 2px 3px 4px #000;
  color: #fff;
  font-size: 4.5vw;
  line-height: 1.0;
}

.setsumei01{
  padding-top: 10px;
}

.img{
  text-align: left;
}

.setsumei_01{
  margin: 1vw auto auto 20%;
}

.setsumei_02{
  margin: -7vw auto auto 52%;
}

.setsumei_03{
  margin: 20px auto auto 30%;
  padding-bottom: 50px;
}

.setsumeikai_1{
  margin: 5vw auto 150px auto;
}

/* footer */

.footer_pc{
  display: flex;
  box-shadow: 0 -2px 2px rgba(0, 0, 0, .5);
}

footer .menu_pc{
  margin-left: 0;
}

.footer_smp{
  display: none;
}

.sns{
  margin: 25px 0 0 auto;
}





/* Company.html */

.company_logo{
  margin-top: 160px;
}

.company_profile{
  padding-bottom: 50px;
  box-shadow: 0 1px 1px 0 rgba(0, 0, 0, .5);
}

.CompanyProfile h2,.contact h2{
  margin: 60px;
}

.CompanyProfile span,.contact_pc span{
  font-size: 1.8vw;
}

table{
  margin: 0 auto;
  margin-bottom: 50px;
}

table th{
  font-size: 1.3vw;
  font-weight: normal;
  text-align: left;
  width: 170px;
}

table td{
  font-size: 2.1vw;
  text-align: left;
  padding: 10px 0;
}

#contact{
  padding-top: 50px;
  padding-bottom: 80px;
}

.contact_smp{
  display: none;
}

.contact p{
  line-height: 2.5;
  font-size: 1.4vw;
}



.agent01 h2{
  margin-top: -100px;
  color: #fff;
  text-shadow: 2px 3px 4px #000;
}

.agentsetsumei h3{
  text-shadow: none;
  margin-top: 130px;
  margin-bottom: 10px;
  font-size: 2.1vw;
}

.agentsetsumei h4{
  margin-top: 0;
  margin-bottom: 80px;
}

.qr{
  line-height: 2.55;
  padding-bottom: 80px;
}

.qr p{
  padding-bottom: 30px;
}

/*shintaku*/
.sp{
  display: none;
}
.shintaku_flex{
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 80%;
  margin: 6em auto;
  padding: 6em 0;
}
.shintaku_left{
  width: 30%;
}
.shintaku_left img{
  width: 100%;
}
.shintaku_right{
  width: 60%;
  font-size: 1.3em;
  line-height: 2;
  text-align: left;
}
.shintaku_hikari{
  background-image: url(../imges/back_img.png);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  padding: 6em 0;
  line-height: 2.5;
}
.title_line {
  align-items: center; /* 横線を上下中央 */
  display: flex; /* 文字と横線を横並び */
  justify-content: center; /* 文字を中央寄せ */
  color: #13365E;
}
.title_line::before,
.title_line::after {
  background-color: #13365E; /* 横線の色 */
  content: "";
  height: 2px; /* 横線の高さ */
  width: 3em; /* 横線の長さ */
}
.title_line::before {
  margin-right: 0.5em; /* 文字との余白 */
}
.title_line::after {
  margin-left: 0.5em; /* 文字との余白 */
}
.manager_voice{
  padding: 7em 0;
  width: 80%;
  margin: 0 auto;
}
.manager_flex{
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-top: 5em;
}
.manager_flex img{
  display: block;
  width: 45%;
}
.manager_flex p{
  text-align: left;
  line-height: 2.5;
  width: 50%;
  font-size: 1.2em;
  margin: 0;
}
.line_cta{
  padding: 10em 0 14em;
}
.bg_gr{
  background-color: #F4F4F4;
}
.shintaku_point{
  padding: 6em 0;
}
.shintaku_title {
  color: #13365E;
  font-weight: bold;
}
.shintaku_point_flex{
  display: flex;
  justify-content: space-between;
  width: 90%;
  margin: 0 auto;
}
.shintaku_point_flex img,.shintaku_reason_in img{
  width: 100%;
}
.shintaku_point_in,.shintaku_reason_in{
  width: 30%;
}
.shintaku_title span{
  font-size: 0.7em;
  font-family: 'SnellRoundhand','cotillion', sans-serif;
  font-weight: lighter;
}
.shintaku_point_in h3{
  font-size: 3em;
  text-shadow:none;
  font-family: 'SnellRoundhand','cotillion', sans-serif;
  font-weight: lighter;
}
.shintaku_point_in h3.title_line::before,
.shintaku_point_in h3.title_line::after {
  background-color: #13365E; /* 横線の色 */
  content: "";
  height: 1px; /* 横線の高さ */
  width: 1.5em; /* 横線の長さ */
}
.shintaku_point_in h4,.shintaku_reason_in h4{
  font-size: 1.8em;
  font-weight: bold;
}
.shintaku_point_in p,.shintaku_reason_in p{
  text-align: left;
  font-size: 1.2em;
  line-height: 2.4;
}
.shintaku_recommendation,.shintaku_example{
  padding: 6em 0 8em;
}
.shintaku_recommendation_in{
  width: 80%;
  margin: 0 auto;
}
.shintaku_recommendation_in img{
  width: 100%;
  padding-top: 6em;
}
.shintaku_example_in{
  width: 60%;
  margin: 4em auto;
}
.shintaku_example_in01{
  padding-top: 4em;
}
.shintaku_example_in h3{
  font-size: 2em;
  text-shadow:none;
  text-align: left;
}
.shintaku_example_in p{
  font-size: 1.2em;
  text-align: left;
  line-height: 2.4;
}
.shintaku_reason{
  padding: 6em 0;
  width: 90%;
  margin: 0 auto;
}
.shintaku_reason_flex{
  width: 90%;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  padding-top: 2em;
}
.shintaku_matome{
  background-image: url(../imges/back_img.png);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  padding: 4em 0;
  color: #13365E;
}
.shintaku_matome h4{
  font-size: 2em;
  font-weight: bold;
  line-height: 2;
}
.shintaku_matome p{
  font-size: 1.2em;
}
.shintaku_matome_flex{
  display: flex;
  align-items: end;
  justify-content: center;
  padding: 3em 0;
}
.shintaku_matome_flex img{
  display: block;
  width: 5em;
  padding-left: 2em;
}


@media screen and (max-width: 540px) {
	/* 480px以下に適用されるCSS（スマホ用） */

  h1.agent_title{
    font-size: 8.5vw;
    text-align: left;
    padding: 250px 0 0 15px;
    width: 90%;
    line-height: 2.0;
  }
  .pc{
    display: none;
  }
  .sp{
    display: block;
  }

  .header_01{
    height: 12vw;
  }

  li a{
    text-decoration: none;
    color: #000;
    }

    /*ナビのスタイル*/
    nav.NavMenu{
    position: fixed;
    z-index: 12;
    top: 0;
    left: 0;
    background: #fff;
    text-align: center;
    width: 100%;
    height: 100%;
    display: none;
    }

    nav.NavMenu ul{
    width: 100%;
    margin: 0 auto;
    padding: 0;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateY(-50%) translateX(-50%);
    }

    nav.NavMenu ul li{
    font-size: 24px;
    list-style-type: none;
    width: 100%;
    padding-bottom: 0px;
    }

    nav.NavMenu ul li:last-child{
    padding-bottom: 0;
    }

    nav.NavMenu ul li a{
    display: block;
    color: #000;
    padding: 15px 0;
    font-weight: bold;
    font-size: 18px;
    }

    /*ボタンのスタイル*/
    .Toggle {
    position: fixed;
    right:18px;
    top: 3px;
    width: 45px;
    height: 45px;
    cursor: pointer;
    z-index: 13;
    display: block;
    }

    .Toggle span {
    display: block;
    position: absolute;
    width: 35px;
    border-bottom: solid 4px #C1C1C1;
    -webkit-transition: .35s ease-in-out;
    -moz-transition: .35s ease-in-out;
    transition: .35s ease-in-out;
    left: 6px;
    }

    .Toggle span:nth-child(1) {
    top: 9px;
    }

    .Toggle span:nth-child(2) {
    top: 20px;
    }

    .Toggle span:nth-child(3) {
    top: 31px;
    }

    .Toggle.active span:nth-child(1) {
    top: 18px;
    left: 6px;
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    transform: rotate(-45deg);
    border-bottom: solid 3px #C1C1C1;
    }
    .Toggle.active span:nth-child(2),
    .Toggle.active span:nth-child(3) {
    top: 18px;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    transform: rotate(45deg);
    border-bottom: solid 3px #C1C1C1;
    }





  .top_smp ul{
    padding-left: 0;
    margin: 0;
  }

  .logo{
    width: 35%;
    padding: 1em 0;
  }

  .header01,.menu_pc,.main_pc,.search_pc,.aboutpc,.setsumei01,.footer_pc,.sanka_pc,.setsumeikai_pc{
    display: none;
  }

  .sanka_smp,.setsumeikai_smp{
    display: block;
  }

  .sanka{
    font-size: 3.8vw;
    width: 100px;
    margin-top: 11px;
    padding: 5px 8px;
  }

  .top_smp{
    display: block;
  }

  .main_smp{
    display: block;
  }

  .shikaku{
    margin-left: 10px;
  }

  .shikaku p{
    font-size: 3.8vw;
  }

  .setsumeikai a,.setsumeikai_1 a{
    font-size: 3.9vw;
  }

  .message{
    text-align: center;
    margin-top: 60px;
  }

  .message p{
    font-size: 5.5vw;
  }

  .titel01{
    height: 30px;
  }

  .search{
    background-image: url(../imges/nayami_smpback.png);
    background-repeat: no-repeat;
    background-size: 100% auto;
    background-position: center;

  }

  .search h2{
    font-size: 5.8vw;
  }

  .search span{
    font-size: 7.2vw;
  }

  .search_smp{
    display: block;
  }

  .search_01{
    margin-left: -1%;
    width: 100%;
    padding-top: 5px;
  }

  .search_01 img{
    width: 92%;
  }

  .search_02{
    margin: 50px 0 0 0;
    width: 100%;
    margin-top: 50px;
  }

  .search_02 img{
    width: 93%;
  }

  .search_pc02{
    margin-top: 29px;
    margin-left: -5%;
    width: 100%;
  }

  .search_pc02 img{
    width: 70%;
  }

  .about01{
    margin: 20px auto 0 auto;
  }

  .aboutsmp{
    display: block;
  }

  .aboutpc_01{
    margin-top: 20px;
  }

  .aboutpc_01 p{
    font-size: 6vw;
    margin-top: -120vw;
    margin-left: 20px;
  }

  .aboutpc_01_1 p{
    font-size: 7vw;
    margin-top: 0;
    padding-bottom: 200px;
  }

  .aboutpc_02 p{
    font-size: 6.8vw;
    margin-left: 20px;
    margin-top: -68vw;
  }

  .aboutpc_02_1 p{
    font-size: 5vw;
    margin-top: 20vw;
  }

  .howtouse{
    margin-top: 28vw;
  }

  .howtouse h2{
    font-size: 5vw;
  }

  .howtouse h3{
    font-size: 4vw;
  }

  .howtouse h4{
    margin: 2px 0;
    font-size: 4.8vw;
  }

  .Step p{
    font-size: 10px;
    width: 100%;
  }
  .Step{
    width: 80%;
  }

  .step1,.step2,.step3,.step4{
    margin-left: 8px;
  }

  .howtouse01,.howtouse02,.howtouse03,.howtouse04{
    width: auto;
    margin: 4vw 0;
  }

  .howtouse01{
    order: 1;
  }
  .howtouse02{
    order: 2;
  }
  .howtouse03{
    order: 3;
  }
  .howtouse04{
    order: 4;
  }

  .howtouse01 img,.howtouse02 img,.howtouse03 img,.howtouse04 img{
    width: 30%;
    height: 30%;
  }

  .setsumei01smp{
    display: block;
    background-image: url(../imges/back_smp.jpg);
  background-repeat: no-repeat;
  }

  .setsumei01smp h2{
    font-size: 6.5vw;
    color: #fff;
    text-shadow: 2px 3px 4px #000;
    padding-top: 20px;
  }

  .setsumei01smp span{
    font-size: 8.5vw;
    color: #fff;
  }

  .setsumei01smp h3{
    color: #fff;
    font-size: 6.5vw;
  }

  .setsumei_01_smp,.setsumei_02_smp,.setsumei_03_smp{
    width: 100%;
    margin: 10px 0;
  }

  .img_smp{
    padding-bottom: 40px;
  }

  footer{
    width: 100%;
  }

  .menu_smp{
    display: flex;
    line-height: 1.0;
    margin-left: 3vw;
  }

  .menu_smp a{
    padding: 0 1.2vw;
    color: #12365e;
    text-decoration: none;
  }

  .footer_smp{
    display: block;
    box-shadow: 0 -2px 2px rgba(0, 0, 0, .5);
  }

  .menu_smp span{
    font-size: 0.3vw;
    margin-bottom: 20px;
  }

  .logo img{
    width: 120px;
    margin-left: 20px;
  }

  .logosns{
    display: flex;
    width: 100%;
  }

  .sns{
    margin-left: 38.5%;
    margin-top: 18px;
    display: flex;
  }

  .sns img{
    padding: 2px;
  }

  .menusmp{
    display: flex;
  }

  .menu_smp span{
    font-size: 2.2vw;
  }

  .menusmp img{
    margin: auto 1vw 0 auto;
  }

  .contact_pc{
    display: none;
  }

  .contact_smp{
    display: block;
  }

  .contact_smp a{
    text-decoration: none;
    color: #fff;
    background-color: #27c07a;
    font-size: 5vw;
    padding: 5px 100px;
    border-radius: 5px;
    text-align: center;
  }

  .company_logo img{
    width: 30%;
  }

  .contact_smp p{
    padding-bottom: 50px;
    font-size: 2vw;
  }

  .CompanyProfile h2,.contact_smp h2{
    font-size: 5vw;
    margin: 30px;
  }

  .CompanyProfile span,.contact_smp span{
    font-size: 3vw;
  }

  table th{
    margin-left: 20px;
    width: 80px;
    font-size: 2vw;
  }

  table td{
    font-size: 3vw;
    padding: 4px 0;
  }


  .main-visual {
    margin-top: 2.9em;
  }
  .shintaku_flex,.manager_flex,.shintaku_point_flex,.shintaku_reason_flex{
    flex-wrap: wrap;
    padding: 0;
  }
  .shintaku_left{
    order: 2;
    width: 80%;
    margin: 0 auto;
  }
  .shintaku_right{
    order: 1;
    width: 100%;
    font-size: 1em;
  }
  .shintaku_hikari h2{
    font-size: 1.4em;
  }
  h2.title_line{
    font-size: 2em;
    line-height: 1.5;
  }
  .title_line::before, .title_line::after {
    width: 1em;
  }
  .manager_flex img{
    width: 100%;
    margin: 2em 0;
  }
  .manager_flex p{
    width: 100%;
    margin-top: 2em;
    line-height: 1.8;
    font-size: 0.89em;
  }
  .manager_voice,.shintaku_point,.shintaku_recommendation, .shintaku_example,.shintaku_reason{
    padding: 4em 0;
  }
  .line_cta {
    padding: 3em 0 7em;
  }
  h2.shintaku_title{
    font-size: 2em;
  }
  .shintaku_point_in,.shintaku_reason_in{
    width: 100%;
  }
  .shintaku_example_in{
    width: 90%;
    padding: 0;
  }
  .shintaku_example_in h3{
    line-height: 1.8;
    font-size: 1.4em;
  }
  .shintaku_example_in p {
    font-size: 1em;
  }
  .shintaku_recommendation_in img{
    padding-top: 3em;
  }
  .shintaku_reason_in{
    margin: 3em 0 0;
  }
  .shintaku_matome h4{
    font-size: 1.5em;        line-height: 1.5;
  }
  .shintaku_matome p{
    width: 90%;
    margin: 0 auto;
    font-size: 1.1em;
    line-height: 1.5;
  }
  .shintaku_linelink{
    margin: 4em 0;
  }
  .shintaku_linelink a{
    font-size: 1.5em;
    color: inherit;
  }
  .shintaku_point_in h4, .shintaku_reason_in h4 {
    font-size: 1.5em;
  }
  .shintaku_point_in p, .shintaku_reason_in p {
    font-size: 1em;
    line-height: 1.8;
  }
  a.agent_linkspan{
    color: #ff3254;
  }
  a span.agent_linkspan_min{
    font-size: 1.9vw;
  }
}