@media screen and (min-width: 1100px) {
.sp{display:none}
}
@media screen and (min-width: 769px) {
a[href^="tel:"]{pointer-events: none;}

/* nav */
.hamburger{display:none;}
.nav_list{display: flex;gap: 10px;justify-content: center;}
.nav_list>li>a,
.nav_list>li>.sub_btn{display:flex;align-items:center;position:relative;font-weight: 500;padding: 0 5px;color: var(--txt);font-size: 16px;margin: 0 5px;letter-spacing: 0.03em}
.nav_list>li>a::before{content: '';position: absolute;width: 0;border-bottom: 1px solid var(--txt);transition: .3s;left: 0;bottom: 0}
.nav_list>li>a:hover::before{width: 100%}
.nav_list>li.parent{position:relative;}
.nav_list>li.parent>.sub_btn{cursor:default}
.sub{position:absolute;z-index:1;transition:all .3s;opacity:0;visibility:hidden;border-top:solid 1px #FFF;width:300px;top:100%;left:0}
.sub ul li a{font-size:16px;display:flex;width:100%;height:60px;align-items:center;letter-spacing:.001em;padding:5px 35px;margin:0 auto;border-bottom:solid 1px #FFF;color:#fff;background:var(--mcolor);}

/*  FOOTER */
.ft_bnn li:not(:last-child){margin-right: 30px;}

/* hover */
.ft_link ul li > a:hover{color:var(--scolor);text-decoration: none;}
.parent:hover .sub{opacity:1;transform:translate(0,0);visibility:visible}
.sub a:hover{background-color:var(--scolor);text-decoration: none;}
.h_contact_mail a:hover{background: var(--scolor)}
.to_top:hover{background-color: var(--scolor);}
#logo,.ft_logo{transition: .3s}
#logo:hover,.ft_logo:hover{opacity: .6}

.btn a:hover::before{width: 0}
.btn a:hover::after{-webkit-animation-name: hvr-icon; animation-name: hvr-icon; -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; -webkit-animation-iteration-count: 1; animation-iteration-count: 1;}
@keyframes hvr-icon{
  16.65% {
    -webkit-transform: translateX(6px);
    transform: translateX(6px);
  }
  33.3% {
    -webkit-transform: translateX(-5px);
    transform: translateX(-5px);
  }
  49.95% {
    -webkit-transform: translateX(4px);
    transform: translateX(4px);
  }
  66.6% {
    -webkit-transform: translateX(-2px);
    transform: translateX(-2px);
  }
  83.25% {
    -webkit-transform: translateX(1px);
    transform: translateX(1px);
  }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}
.btn_box a:hover{background: var(--mcolor);color: var(--txt);}
.btn_box a:hover::before{height: 100%}
.ft_info ul li .detail_link a:hover::before{width: 100%}
.ft_link a:hover::before{width: 0}

}

@media screen and (min-width: 1101px) and (max-width: 1560px){
  .sec01{padding-top: 8px}
}
@media screen and (min-width: 768px) and (max-width: 1800px){
  .s01_img{width: 50%;max-width: 579px}
  .s02_content{max-width: 650px}
  .sec01 .content_2col{justify-content: space-between;}
  .s01_ttl{font-size: 66px}
  .s02_img{width: 50%;max-width: 380px;margin-left: 60px}
  .s02_img02{max-width: 346px;margin-left: 0;margin-right: 60px}
  .sec03 .content_2col{gap: 60px;justify-content: space-between;}
  .s03_ttl{font-size: 45px}
  .s03_img{width: 243px}
  .s04_img{width: 50%;max-width: 380px;margin-left: auto;margin-right: auto;}
}

/* screen-min:1100px latop - mobile*/
@media screen and (max-width: 1100px) {
  img{max-width:100%; height: auto;}
.swap img{width:auto;}
#wrapper,
header,
main,
footer,
.inner{width:100%!important;min-width:unset!important}
.pc{display:none!important}

/* NAV */
nav{position:fixed;top:80px;left:0;width:100%;height:calc(100vh - 60px);overflow:auto;padding-bottom:80px;z-index:100;background: var(--mcolor);visibility: hidden;transition: .4s;transform: scaleY(0.7);opacity: 0;transform-origin: top}
nav.is_active{opacity: 1;transform: scaleY(1);visibility: visible;}
nav .container{padding: 0;}
.nav_list{flex-direction:column;gap: 0}
.nav_list ul,
.nav_list li{width:100%}
.nav_list .parent .sub ul li{background: #fff;}
.nav_list .parent .sub ul li:not(:last-child){border-bottom:1px solid var(--mcolor)}
.nav_list>li>a, .nav_list>li>.sub_btn {display:block;padding:13px 15px 12px;font-size:16px;font-weight:600;border-bottom:solid 1px #fff;color: var(--txt);}
.nav_list .sub_btn{position:relative;padding-left:15px}
.nav_list .sub_btn::before,
.nav_list .sub_btn::after{content:"";position:absolute;width: 16px; height: 2px; background-color: #FFF;top:calc(50% - 1px);right:10px; transition: all 0.3s;}
.nav_list .sub_btn::after{transform: rotate(-90deg);}
.nav_list .sub_btn.open::after{transform: rotate(0);}

.sub{display:none}
.sub ul:not(:last-child){margin-bottom:15px}
.sub a{color:var(--mcolor);border-bottom:none;}
.hamburger{position:absolute;right:1%;bottom:0;font:inherit;display:block;overflow:visible;margin:0;cursor:pointer;transition-timing-function:linear;transition-duration:.15s;transition-property:opacity,filter;text-transform:none;color:inherit;border:0;z-index: 101}

/*============ HEADER ============*/
#logo{width: 270px}
.h_box{height:80px}
.h_inner{padding: 0 20px;}
header.show .h_inner{display: flex;}
main{padding-top: 80px;}

.content_2col{justify-content: center;}

footer::before{font-size: 330px;left: calc(50% - 980px/2)}
.to_top{width: 60px;height: 60px}
}

/*Tablet*/
@media screen and (min-width: 768px) and (max-width: 1024px){
  .no_tablet{display: none;}
  .s01_ttl{font-size: 6vw}
  .s01_ttl .sm{font-size: 47%}
  .ttl .ja{font-size: 62px}
  .s02_img{text-align: center;margin-left: auto;margin-right: auto;}
  .s03_img{width: 260px;margin-top: 15px}
  .s03_content .content_box .s03_img_ttl{font-size: 32px}
  .sec03 .content_2col{gap: 40px}
  .s03_ttl{font-size: 37px}
  footer::before{left: 50%; transform: translateX(-50%);font-size: 30vw;top: -80px}
}

/*SP*/
@media screen and (max-width: 767px) {
  .hamburger{bottom: -5px}
  nav{top: 60px}
  :root {--mfont-size: 16px;}
/*=====================================================
                      C U S T O M
======================================================*/
main{padding-top: 60px}

section,.sec01,.sec02,.sec03,.sec04{padding: 0 0 40px}
.sec03_mb{margin-bottom: 40px}

/*============ HEADER ============*/
#logo{width: 270px}
.h_box{height:60px}
.h_inner{padding: 0 20px;}
header.show .h_inner{display: flex;}

/*============ Main ============*/
.ttl{font-size: 42px;margin-bottom: 10px}
.ttl .ja{font-size: 100%}
.content_2col.reverse,
.content_2col{flex-direction: column;}
.s02_content,
.s04_content{order: 2}

/* sec01 */
.sec01{padding-top: 20px;padding-bottom: 0}
.s01_ttl{font-size: 42px;margin-top: 0}
.s01_ttl .sm{font-size: 60%}
.s01_img{max-width: 324px;width: 100%;margin: 30px auto 0}
.sec01 .content_2col{align-items: center;}


/* sec02 */
.s02_img{width: 100%;max-width: 237px;margin: 0 auto 20px}
.s02_img02{max-width: 215px}
.sec02 .content_2col.reverse{margin-top: 40px}
.s02_content .btn{margin-top: 20px}

/* sec03 */
.sec03{padding-top: 40px}
.s03_content .content_box .s03_img_ttl{font-size: 25px;justify-content: center;margin-top: 20px;gap: 10px}
.s03_img{width: 100%;max-width: 200px;margin: 0 auto}
.sec03 .content_2col{gap: 20px}
.s03_ttl{font-size: 36px;line-height: 1.2em}
.s03_content .content_box p{letter-spacing: 0}
.s03_content,
.s03_content02{gap: 20px;display: flex;flex-direction: column;}
.s03_content table{margin-bottom: 0}
/* sec04 */
.sec04{padding-top: 40px}
.s04_content{margin-top: 0}
.s04_img{width: 100%;max-width: 298px;margin: 0 auto 20px}
/* sec05 */
.s05_ttl{font-size: 37px}

/*============ FOOTER ============*/
footer::before{font-size: 30vw;left: 50%;transform: translateX(-50%);top: -30px}
footer{padding: 90px 0 80px}
.ft_content{flex-direction: column;width: 100%;max-width: 480px;margin: 0 auto}
.ft_info ul li.label{flex-shrink: 0;width: 70px}
.ft_logo{display: flex;justify-content: left;margin-bottom: 20px}
.ft_logo a{font-size: 40px;margin-bottom: 0}


/* sp contact */
.sp_contact{display:flex;justify-content:center;align-items:center;width:100%;height:50px;position:fixed;left:0;z-index:99; bottom:-55px;transition: all 0.3s;}
.sp_contact.show{bottom: 0;}
.sp_contact li{width:50%;height:100%;}
.sp_contact li a{width:100%;height:100%;display:flex;justify-content:center;align-items:center;color:#fff;font-size:14px;}
.sp_contact li a span{position:relative;padding-left:25px}
.sp_contact li a span::before{content:"";position:absolute;width:20px;height:20px;left:-5px;top:calc(50% - 10px)}
.sp_contact_tel{background-color:var(--mcolor)}
.sp_contact_mail{background-color:var(--blue)}

/* to top */
.to_top{width:40px;height:40px;right:10px;bottom: 60px;}
.to_top img{width: 13px}

/*============ END 1100 ============ */
}

@media screen and (max-width: 767px) {
  /*============ TABLE ============ */
table{margin-bottom:30px;border: 0}
table td,
table th{padding:15px 10px}
table.tb_block tr{display:flex;flex-direction:column}
table.tb_block td{border-top-width: 0;border-bottom-width: 0}
table.tb_block th,
table.tb_block td{width: 100%;}
table.tb_block th{border-right: 0;border-bottom: 1px solid var(--txt);width: 100%}
table tr:last-child th{border-bottom-width: 1px}

.sec05{margin: 80px 0}
}

/* screen-max:460px */
@media screen and (max-width: 479px) {
  .post-item{flex-wrap: wrap;}
  .post-title {flex: 100%;width: 100%}
}

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

}

@media screen and (max-width: 320px) {
html,body {
    min-width: 320px;
    overflow-x: hidden;
  }
.s01_ttl{font-size: 36px}
}