@charset "UTF-8";
/* CSS Document */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100;300;400;500;700&display=swap');
body{
	margin:0;
	padding:0;
	color:#121821;
	background:#fff;
	font-size:16px;
	font-weight:400;
	line-height:1.6;
	overflow-x:hidden;
	font-family: 'Noto Sans JP', sans-serif;
	-webkit-text-size-adjust: 100%;
}
*, *:before, *:after {
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
         -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
            box-sizing: border-box;
}
.din{
    font-family: din-2014, sans-serif;
}
body.open, body.modaal-noscroll{
	overflow: hidden;
}

img{
	vertical-align:bottom;
	max-width:100%;
	height:auto;
}

a {
	color:#121821;
	text-decoration:none;
	transition: all 0.3s ease-in-out 0s;
}

a:hover {
	text-decoration:none;
}
.flex_wrap{
	display: -webkit-flex;
    display: flex;
	-webkit-flex-wrap: wrap; /* Safari */
	flex-wrap:wrap;
}
.flex_wrap_between{
	display: -webkit-flex;
    display: flex;
	-webkit-flex-wrap: wrap; /* Safari */
	flex-wrap:wrap;
    -webkit-justify-content: space-between;
    justify-content: space-between;
}
.flex_wrap_center{
	display: -webkit-flex;
    display: flex;
	-webkit-flex-wrap: wrap; /* Safari */
	flex-wrap:wrap;
	justify-content: center;
}
.flex_wrap_middle{
	display: -webkit-flex;
    display: flex;
	-webkit-flex-wrap: wrap; /* Safari */
	flex-wrap:wrap;
	align-items: center;
}

.sp{display:none;}
.note{font-size:14px; text-align: center;}

input, textarea{
    background: none;
    border: none;
    border-radius: 0;
    outline: none;
    margin: 0;
    padding: 0;
    font-family: 'Noto Sans JP', sans-serif;
}
.roboto{
    font-family: 'Roboto', sans-serif;
}
/************************
header
************************/
.header{
    position: fixed;
    width: 100%;
    padding: 14px 30px;
    align-items: center;
    transition: all 0.3s ease-in-out 0s;
    z-index: 100;
}
.fixed_menu .header{
    background:rgba(255,255,255,0.5);
}
.header .logo{
    width: 103px;
}
.main_nav{
    font-size: 14px;
}
.main_nav li{
    margin-left: 30px;
}
.main_nav li a:hover{
    opacity: .7;
}

.hd_tel{
    margin-left: 40px;
}
.hd_tel figure{
    margin-right: 6px;
}
.hd_tel p{
    font-size: 12px;
    color: #242F3F;
    line-height: 1;
}
.hd_tel p a{
    color: #242F3F;
}
.hd_tel p span{
    font-family: 'Roboto', sans-serif;
    display: block;
    font-size: 28px;
    font-weight: 600;
}
/************************
kv
************************/

/************************
btn
************************/
.btn a{
    text-align: center;
    background: #133C78;
    color: #fff;
    border-radius: 100vh;
    font-weight: 600;
    font-size: 20px;
    padding: 20px;
    width: 100%;
    max-width: 320px;
    position: relative;
    display: block;
}
.btn a::after{
    position: absolute;
    display: block;
    content: '';
    width:8px;
	height:8px;
	border-top: 2px solid #fff;
	border-right: 2px solid #fff;
    transform: rotate(45deg);
	top:0;
	bottom:0;
	right:20px;
	margin:auto;
}
.btn a:hover{
    opacity: .7;
}
.btn_head{
    margin-left: 30px;
}
.btn_head a{
    width: 220px;
    font-size: 16px;
    padding: 10px;
}

/************************
content
************************/
.inner_1000{
    margin: auto;
    width: 90%;
    max-width: 1000px;
}
.kv{
    background: url("../img/bg_kv.png") center;
    background-size: cover;
    padding: 160px 0;
}
.kv h1{
    font-size: 60px;
    margin-bottom: 20px;
}
.kv p{
    font-size: 20px;
    margin-bottom: 46px;
}

.logos{
    padding: 40px 0;
}
.logos li{
    width: 16.666%;
    padding: 0 20px;
}

.intro{
    padding: 60px 0;
    background: rgba(95,156,177,0.2);
    position: relative;
}
.intro::after{
    position: absolute;
    display: block;
    content: '';
    margin: auto;
    height: 0;
    width: 0;
    border-color: transparent;
    border-top: 40px solid rgba(95,156,177,0.2);
    border-left: 90px solid transparent;
    border-right: 90px solid transparent;
    left: 0;
    right: 0;
    bottom: -40px;
}
.inner_intro{
    width: 100%;
    max-width: 700px;
    margin: auto;
    position: relative;
}
.pic_intro{
    position: absolute;
    bottom: -100px;
    right: -70px;
    width: 70px;
}
.intro h2{
    font-size: 36px;
    margin-bottom: 40px;
}
.list_intro li{
    padding-left: 30px;
    background: url("../img/icon_intro.png") no-repeat left top 2px;
    background-size: 20px auto;
    font-size: 18px;
    margin-bottom: 20px;
}
.list_intro li:last-child{
    margin-bottom: 0;
}

.intro_2{
    padding: 80px 0 60px;
    text-align: center;
    font-size: 18px;
}
.intro_2 h2{
    color: #FF9900;
    font-size: 36px;
    margin-bottom: 20px;
}
.ans_in2{
    color: #133C78;
    font-size: 24px;
    font-weight: 600;
}
main{
    width: 100%;
    overflow: hidden;
}
.sec_01{
    padding: 100px 0 130px;
    position: relative;
    z-index: 1;
}
.sec_01::after{
    position: absolute;
    display: block;
    content: '';
    margin: auto;
    height: 100%;
    min-width: 1920px;
    width: 120%;
    top:0;
    left: -10%;
    background: url("../img/bg_sec01.png") center top;
    background-size: cover;
    z-index: -1;
}

.sec_def h2{
    text-align: center;
    font-size: 36px;
    margin-bottom: 60px;
}
.h2_wrap{
    position: relative;
    z-index: 1;
}
.h2_eg{
    position: absolute;
    color: #133C78;
    opacity: .1;
    top: -90px;
    margin: auto;
    left: -84px;
    font-size: 120px;
    font-family: 'Roboto', sans-serif;
    z-index: -1;
}
.sec_01 .h2_eg{
    color: #fff;
    opacity: .7;
}
.list_feature li{
    margin-bottom: 110px;
    align-items: flex-end;
}
.list_feature li:last-child{
    margin-bottom: 0;
}
.list_feature li .lf_text{
    width: 60%;
    position: relative;
    z-index: 2;
    background: #fff;
    box-shadow: 0px 3px 20px #14283A33;
    border-radius: 40px;
    padding: 40px 50px 60px;
}
.list_feature li:nth-child(even) .lf_text{
    order: 2;
}
.list_feature li figure{
    width: 42%;
    margin-left: -2%;
    position: relative;
    z-index: 1;
    margin-bottom: -50px;
}
.list_feature li:nth-child(even) figure{
    order: 1;
    margin-right: -2%;
    margin-left: 0;
}
.list_feature li h3{
    margin-bottom: 20px;
    color: #133C78;
    font-size: 24px;
}
.list_feature li h3 .num_ttl{
    font-size: 80px;
    font-family: 'Roboto', sans-serif;
    color: #FF9900;
    width: 100px;
    line-height: 1;
}
.list_feature li h3 .text_ttl{
    width: calc(100% - 100px);
}

.cv_area{
    padding: 80px 0;
    background: #FF9900;
}
.inner_cv{
    margin: auto;
    width: 90%;
    max-width: 650px;
}
.inner_cv h2{
    text-align: center;
    font-size: 36px;
    margin-bottom: 40px;
}
.cv_area .btn{
    width: 49%;
}
.cv_area .hd_tel{
    margin-left: 0;
}
.cv_area .hd_tel p{
    color: #121821;
}

.sec_02{
    padding: 80px 0;
    background: url("../img/bg_sec02.png") no-repeat center;
    background-size: auto 100%;
}
.list_case{
    width: calc(100% + 80px);
    margin-left: -38px;
}
.list_case li{
    padding: 10px 40px;
    height: 100%;
}
.case_wrap{
    background: #fff;
    box-shadow: 0px 0px 20px #133C7833;
    border-radius: 40px;
    padding: 40px;
    height: 100%;
}
.case_wrap figure{
    text-align: center;
    margin-bottom: 20px;
}
.case_wrap figure img{
    width: 84%;
    margin: auto;
}
.case_wrap h3{
    font-size: 22px;
    color: #133C78;
    margin-bottom: 20px;
}
.yellow{
    color: #FF9900;
}
.slick-track {
  display: flex;
}
.slick-slide {
  height: auto !important;
}
.slick-slide > div{
    height: 100%;
}

.sec_03{
    padding: 80px 0;
}
.list_flow li{
    width: 23%;
    position: relative;
    padding: 20px;
    box-shadow: 0px 0px 20px #133C7833;
    border-radius: 40px;
    background: #fff;
}
.list_flow li:after{
    position: absolute;
    display: block;
    content: '';
    width: 12px;
    height: 12px;
    border-top: 2px solid #133C78;
    border-right: 2px solid #133C78;
    transform: rotate(45deg);
    top: 0;
    bottom: 0;
    right: -7%;
    margin: auto;
}
.list_flow li:last-child:after{
    display: none;
}
.list_flow li h3{
    text-align: center;
    color: #133C78;
    font-size: 24px;
    margin-bottom: 20px;
}
.list_flow li h3 .step{
    display: block;
    color: #FF9900;
    font-size: 16px;
    font-family: 'Roboto', sans-serif;
}
.list_flow li h3 .num{
    margin-left: 10px;
    font-size: 24px;
}
.list_flow li p{
    padding-left: 8px;
}

.sec_04{
    padding: 80px 0;
    background: url("../img/bg_sec04.png") no-repeat center top;
    background-size: 1940px auto;
}
.sec_04 .h2_eg{
    left: auto;
    right: -84px;
}
.sec_04 dl{
    margin-bottom: 30px;
}
.sec_04 dl:last-of-type{
    margin-bottom: 0;
}
.sec_04 .i_faq{
    font-family: 'Roboto', sans-serif;
    font-size: 36px;
    font-weight: 600;
    width: 65px;
}
.sec_04 .text_faq{
    width: calc(100% - 65px);
}
.sec_04 dl dt{
    box-shadow: 0px 0px 20px #133C7833;
    border-radius: 20px;
    background: #fff;
    padding: 26px 90px 26px 60px;
    color: #133C78;
    font-size: 18px;
    font-weight: 600;
    cursor: pointer;
    position: relative;
}
.sec_04 dl dt::after{
    position: absolute;
    display: block;
    content: '';
    width: 12px;
    height: 12px;
    border-bottom: 2px solid #133C78;
    border-right: 2px solid #133C78;
    transform: rotate(45deg);
    top: 0;
    bottom: 0;
    right: 60px;
    margin: auto;
}
.sec_04 dl dt.is-active::after{
    transform: rotate(-135deg);
}
.sec_04 dl dd{
    padding: 26px 60px;
    display: none;
}

.sec_05{
    background: rgba(255,153,0,.7);
    padding: 80px 0;
}
.sec_05 .h2_eg {
    color: #fff;
    opacity: .7;
    left: auto;
    right: -14px;
}
.form_dl{

}
.form_dl dt{
    margin-bottom: 10px;
}
.form_dl dt .req{
    display: inline-block;
    padding: 5px 10px;
    color: #fff;
    margin-right: 10px;
    background: #133C78;
    font-weight: 400;
    font-size: 18px;
}
.form_dl dt .req.non_req{
    background: #cacaca;
    color: #fff;
}
.form_dl dt{
    font-size: 22px;
    font-weight: 600;
}
.form_dl dt .placeholder{
    margin-left: 30px;
    font-size: 16px;
    opacity: .7;
}
.form_dl dd{
    margin-bottom: 37px;
}
.form_dl input, .form_dl textarea{
    background: #fff;
    box-shadow: 0px 0px 20px #133C7833;
    border-radius: 10px;
    padding: 15px 10px;
    width: 100%;
}
.form_dl textarea{
    height: 200px;
}
.policy_link{
    font-size: 12px;
    text-align: center;
    margin-bottom: 10px;
}
.policy_link a{
    text-decoration: underline;
}

.submit{
    margin: auto;
    width: 100%;
    max-width: 320px;
    position: relative;
    cursor: pointer;
    transition: all 0.3s ease-in-out 0s;
}
.submit input{
    text-align: center;
    background: #133C78;
    color: #fff;
    border-radius: 100vh;
    font-weight: 600;
    font-size: 20px;
    padding: 20px;
    width: 100%;
    cursor: pointer;
    transition: all 0.3s ease-in-out 0s;
}
.submit:hover{
    opacity: .7;
}
.submit::after{
    position: absolute;
    display: block;
    content: '';
    width:8px;
	height:8px;
	border-top: 2px solid #fff;
	border-right: 2px solid #fff;
    transform: rotate(45deg);
	top:0;
	bottom:0;
	right:20px;
	margin:auto;
}

#footer {
    position: relative;
    background: #fff;
    padding: 5em 0 0.6em;
}
.u_inner {
    max-width: 1120px;
    margin: 0 auto;
    padding: 0 21px;
}
#gototop {
    position: absolute;
    right: 21px;
    bottom: 21px;
    height: 136px;
}
#gototop a {
    display: block;
    transition-property: margin-top;
    -webkit-transition-property: margin-top;
}
#gototop a:hover {
    opacity: 1;
    margin-top: -0.5em;
}
.f_logo {
    float: left;
    margin-right: 63px;
    width: 174px;
}
.f_info {
    float: left;
    font-size: 13px;
}
.btn_ft{
    float: right;
    margin-right: 25px;
    padding:31.5px 0 94.5px;
}
.btn_ft a{
    font-size: 14px;
    width: 230px;
    padding: 15px;
}
.f_nav{
    margin-bottom: 21px;
}
.f_nav li, .f_link li {
    display: inline-block;
    font-size: 14px;
    font-weight: bold;
}
.f_nav li + li {
    margin-left:42px;
}
.f_link{
    margin-bottom: 31px;
}
.f_link li + li{
    margin-left: 56px;
}
.f_fb {
    text-align: right;
    margin-bottom:21px;
}
.f_fb a{
    display: block;
}
.f_fb span {
    font-size: 10px;
    font-weight: 900;
}
.ft_e {
    font-family: 'Montserrat', sans-serif;
}
.f_fb img {
    vertical-align: middle;
    margin-left:21px;
    transition: margin-left .2s ease-in;
    -webkit-transition: margin-left .2s ease-in;
}
.f_fb a:hover img {
    margin-left: 14px;
}
.f_copy {
    text-align: right;
    color: #afaeae;
    font-size: 10px;
    letter-spacing: .05em;
}
/************************
menu btn
************************/
.menu_btn{
	display:none;
    position: relative;
	width: 30px;
	height: 30px;
	text-align: center;
	cursor:pointer;
	transition: all 0.3s ease-in-out 0s;
    z-index: 101;
}
.sp_nav_btn{
	width: 100%;
	height: 100%;
	z-index: 1000;
	text-align: center;
	position: relative;
}
#panel-btn{
  display: inline-block;
  width: 30px;
  height: 30px;
  margin: auto;
  position: absolute;
  top:0;
  bottom:0;
  left: 0;
  right: 0;
}
#panel-btn:hover{
}
#panel-btn-icon{
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  bottom:0;
  right:0;
  width: 100%;
  height: 2px;
  margin: auto;
  background: #707070;
  transition: .2s;
}
#panel-btn-icon:before, #panel-btn-icon:after{
  display: block;
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  height: 2px;
  background: #707070;
  transition: .5s;
}
#panel-btn:hover #panel-btn-icon, #panel-btn:hover #panel-btn-icon:before, #panel-btn:hover #panel-btn-icon:after{
}
#panel-btn-icon:before{
  margin-top: -12px;
}
#panel-btn-icon:after{
  margin-top: 10px;
}
#panel-btn .close, #panel-btn:hover #panel-btn-icon.close{
  background: transparent;
}
#panel-btn .close:before, #panel-btn .close:after{
  margin-top: 0;
}
#panel-btn .close:before{
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  background: #fff;
}
#panel-btn .close:after{
  transform: rotate(135deg);
  -webkit-transform: rotate(135deg);
  background: #fff; 
}
.tel_sp{
    display: none;
    width: 228px;
    margin: auto;
}
.sec_thanks{
    padding-top: 200px;
}
/********************************
sp
********************************/
@media screen and (max-width: 1000px) {
    .menu_btn{display: block;}
    .hd_r{position: fixed; top: 0;right: -100%; width: 100%; height: 100%; background: rgba(18,24,33,0.7);transition: all 0.3s ease-in-out 0s; display: block;padding: 50px 0;
    overflow: auto;}
    .open .hd_r{right: 0;}
    .main_nav li{width: 100%; margin: 20px 0;text-align: center;}
    .main_nav li a{color:#fff;}
    .header .hd_tel{display: none;}
    .btn_head{margin:40px 0 80px;}
    .btn_head a{width: 90%; margin: auto;}
    .tel_sp{display: block;}
}
@media screen and (max-width: 768px) {
    .header{padding: 10px 4%;}
}
@media screen and (max-width: 768px) {
	body{ font-size:12px;}
	.sp{ display:block;}
	.pc{display:none;}
    .kv{padding: 80px 0; background-image: url("../img/bg_kv_sp.png"); height: 100%; min-height: 500px;}
    .kv h1{font-size: 30px;}
    .kv p{font-size: 12px; margin-bottom: 23px;}
    .btn a{font-size: 14px; padding: 15px; margin: auto;}
    .logos{padding: 20px;}
    .logos li{width: 33.3333%;}
    .intro{padding: 30px 0;}
    .intro h2{font-size: 18px;margin-bottom: 20px;}
    .list_intro li{font-size: 14px;}
    .pic_intro{display: none;}
    .intro::after{border-top: 20px solid rgba(95,156,177,0.2);border-left: 45px solid transparent;border-right: 45px solid transparent; bottom: -20px;}
    .intro_2{padding: 40px 0 30px; font-size: 13px;}
    .intro_2 h2{font-size: 18px;}
    .ans_in2{font-size: 14px;}
    .sec_01{padding: 40px 0;}
    .sec_def h2{font-size: 18px; margin-bottom: 30px;}
    .h2_eg{font-size: 60px; top: -40px; left: -40px;}
    .list_feature li{margin-bottom: 30px;}
    .list_feature li .lf_text{width: 100%; order: 2; padding: 15px; border-radius: 20px;}
    .list_feature li figure{width: 100%; margin: 0 0 10px; order: 1; text-align: center;}
    .list_feature li figure img{width: 70%;}
    .list_feature li h3{font-size: 16px; margin-bottom: 10px;}
    .list_feature li h3 .num_ttl{font-size: 40px; width: 50px;}
    .list_feature li h3 .text_ttl{width: calc(100% - 50px);}
    .sec_01::after{min-width: 200%;}
    .cv_area{padding: 40px 0;}
    .inner_cv h2{font-size: 18px; margin-bottom: 20px;}
    .cv_text{margin: 0 auto 20px;}
    .cv_area .btn{width: 100%;}
    .list_case{width: 100%; margin: auto;}
    .list_case li{padding: 10px;}
    .case_wrap{padding: 20px;box-shadow: 0px 0px 10px #133C7833;border-radius: 20px;}
    .case_wrap h3{font-size: 15px; margin-bottom: 10px;}
    .sec_02, .sec_03, .sec_04, .sec_05{padding: 40px 0;}
    .list_flow li{width: 100%; padding: 20px; margin-bottom: 40px;border-radius: 20px;}
    .list_flow li:after{transform: rotate(135deg); left: 0; right: 0;top: auto; bottom: -20px;}
    .sec_04 dl{margin-bottom: 15px;}
    .sec_04 dl dt{padding: 20px 40px 20px 20px; font-size: 15px;border-radius: 20px;}
    .sec_04 dl dt::after{right: 15px;}
    .sec_04 .i_faq{font-size: 20px; width: 30px;}
    .sec_04 .text_faq{width: calc(100% - 30px);}
    .sec_04 dl dd{padding: 20px;}
    .form_dl dt{font-size: 14px;}
    .form_dl dt .req{font-size: 12px;}
    .form_dl dt .placeholder{font-size: 10px; margin-left: 10px;}
    .form_dl dd{margin-bottom: 16px;}
    .submit input{font-size: 16px; padding: 10px;}
    #footer{padding: 40px 0 12px;}
    .u_inner{width: auto; margin: 0 4.6%;padding: 0;}
    #gototop{right: 9px; top: 10px;}
    .f_logo{float: none; text-align: center; margin: 0 0 40px;}
    .f_info{float: none;font-size: 12px;}
    .btn_ft{float: none;margin: 0; padding: 30px 0 40px;}
    .f_nav{margin-bottom: 10px;}
    .f_nav li:nth-child(1){display: block;}
    .f_nav li{margin-right: 30px;}
    .f_nav li + li{margin-left: 0;}
    .f_link li{font-size: 12px;margin-right: 30px;}
    .f_link li + li{margin-left: 0;}
}