@charset "UTF-8";
/* CSS Document */

/* R E S E T - Excerpt from Sanitize
----------------------------------------------------*/
/* CSS Remedy */
*,::after,::before{box-sizing:border-box}
html{line-sizing:normal}
body{margin:0}
pre{white-space:pre-wrap}
audio,canvas,embed,iframe,object,svg,video{display:block;vertical-align:middle;max-width:100%}
canvas,img,svg,video{height:auto}
audio{width:100%}
img{border-style:none}
svg{overflow:hidden}
article,aside,figcaption,figure,footer,header,hgroup,main,nav,section,p,dl,dt,dd {display:block;margin: 0;}
em,strong {font-style: normal; font-weight: normal;}
[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}
::before,
::after {
text-decoration: inherit;
vertical-align: inherit;
}


/* var */
:root {
--font-family:YakuHanJP_Noto, "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
--font-family-en:"Open Sans", "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
--font-color:#1A1A1A;

--font-size:min(3.2vw,14px);
--font-size-md:min(2.6vw,15px);
--font-size-xl:16px;


/* font size */
--10px:63%;
--11px:75%;
--12px:80%;
--13px:82%;
--14px:88%;
--15px:94%;
--16px:100%;
--17px:106%;
--18px:112%;
--19px:120%;
--20px:125%;
--22px:138%;
--24px:150%;
--26px:163%;
--28px:165%;
--30px:175%;
--32px:200%;
--34px:213%;
--36px:225%;
--38px:238%;
--40px:250%;

--black:#000000;
--blue:#348CB0;
--orange:#F5A80F;
--red:#D92A00;
--lightgray:#E5E5E5;
--palegray:#F6F6F6;
--gray20:#D1D1D1;
--gray50:#8C8C8C;
--gray70:#5F5F5F;

--bg-opacity: .8;
--transition: all .2s;
--shadow:0 0 10px rgba(0,0,0,.2);

}/* root */


html {
cursor: default;
-webkit-tap-highlight-color: transparent;
-ms-text-size-adjust: 100%;
-webkit-text-size-adjust: 100%;
word-break: break-word;
font-size: 62.5%;
scroll-padding-top: calc((var(--headerHeight, 80px)) + 30px);
}
body {
margin: 0;
font-family:var(--font-family);
color:var(--font-color);
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
background: #FFF;

overflow-wrap: break-word;
font-feature-settings:"palt";
letter-spacing: 0.05em; 
}

article,nav,header,footer {
font-size: var(--font-size);
line-height: 1.8;
font-weight: 400;
letter-spacing: 0.05em;
}

article {
}

.en {font-family:var(--font-family-en);}
.sans {font-family:var(--font-family);}





/* T A G
----------------------------------------------------*/

h1,h2,h3,h4,h5,h6 {
margin:0;
padding:0;
font-size: 100%;
font-weight: normal;
}
img {
max-width: 100%;
height: auto;
border-style: none;
}
a {
text-decoration: none;
transition: all .2s;
color: var(--font-color);
}
a:hover {
opacity:0.8;
}
hr {
height: 0;
margin: 1rem 0;
padding: 0;
border: 0;
border-top: 1px solid var(--gray20);
}
audio,
canvas,
iframe,
img,
svg,
video {vertical-align: middle;}
iframe {border-style: none;}
table {border-collapse: collapse;}



/* form */
button,
input,
select,
textarea {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
background: transparent;
border: none;
border-radius: 0;
font: inherit;
outline: none;
color: var(--font-color);
}
:focus {
outline: 0;
}
textarea {
resize: vertical;
}
input[type='checkbox'],
input[type='radio'] {
display: none;
}
input[type='submit'],
input[type='button'],
label,
button,
select {
cursor: pointer;
}
select::-ms-expand {
display: none;
}


::-webkit-input-placeholder {
color: inherit;
opacity: 0.6;
}

a,area,button,input,label,select,summary,textarea,[tabindex] {
-ms-touch-action: manipulation;
touch-action: manipulation;
}


/* R A Y O U T
----------------------------------------------------*/

.container {
position: relative;
padding: 3rem 0;
}

.wrapper {
position: relative;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
justify-content: center;
width: 100%;
margin:0 auto;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
box-sizing: border-box
}
.wrapper:after{
content:"";
display: block;
clear:both;
box-sizing: border-box;
}



/* G R I D
-----------------------------------------*/
.col-1,.col-2,.col-3,.col-4,.col-5,.col-6,.col-7,.col-8,.col-9,.col-10,.col-11,.col-12,.col {
position: relative;
display: block;
padding: min(2.5vw,20px);
width: 100%;
box-sizing: border-box
}
.col-1-sp {width: 8.333333%;}
.col-2-sp {width: 16.666667%;}
.col-3-sp {width: 25%;}
.col-4-sp {width: 33.333333%;}
.col-5-sp {width: 41.666667%;}
.col-6-sp {width: 50%;}
.col-7-sp {width: 58.333333%;}
.col-8-sp {width: 66.666667%;}
.col-9-sp {width: 75%;}
.col-10-sp {width: 83.333333%;}
.col-11-sp {width: 91.666667%;}
.col-12-sp {width: 100%;}

.wrapper.w-full .col-1,
.wrapper.w-full .col-2,
.wrapper.w-full .col-3,
.wrapper.w-full .col-4,
.wrapper.w-full .col-5,
.wrapper.w-full .col-6,
.wrapper.w-full .col-7,
.wrapper.w-full .col-8,
.wrapper.w-full .col-9,
.wrapper.w-full .col-10,
.wrapper.w-full .col-11,
.wrapper.w-full .col-12,
.wrapper.w-full .col {
padding: min(2.5vw,20px) 0;
}



/* C O M M O N
=========================================================*/

/* ------------
class
------------ */
.both {clear: both;}
.over {overflow: hidden}
.nowrap { white-space: nowrap; }
.breakall { word-break: break-all; }
.clearfix {zoom: 1;}
.clearfix:after {
content: "";
display: block;
clear: both;
}

/* ------------
flex
------------ */
/*flex-direction*/
.row {flex-direction:row!important;} /* default */
.row-reverse {flex-direction: row-reverse;}
.column {flex-direction: column!important;}
.column-reverse {flex-direction: column-reverse;}

/*flex-wrap*/
.nowrap {flex-wrap: nowrap;} /* default */
.wrap {flex-wrap: wrap;}
.wrap-reverse {flex-wrap: wrap-reverse;}

/* flex-flow  */
.row-wrap {flex-flow: row wrap!important;}
.column-wrap {flex-flow: column wrap!important;}
.row-nowrap {flex-flow: row nowrap!important;}
.column-nowrap {flex-flow: column nowrap!important;}

/*justify-content*/
.jc-start {justify-content: flex-start;}
.jc-center {justify-content: center;}
.jc-end {justify-content: flex-end;}
.jc-around {justify-content: space-around;}
.jc-between {justify-content: space-between;}
.jc-evenly {justify-content: space-evenly;}

/*align-items */
.ai-stretch {align-items: stretch;} /* default */
.ai-start {align-items: flex-start;}
.ai-end {align-items: flex-end;}
.ai-center {align-items: center;}
.ai-baseline {align-items: baseline;}

/* align-content */
.ac-stretch {align-content: flex-start;}
.ac-start {align-content: flex-start;}
.ac-center {align-content: center;}
.ac-end {align-content: flex-end;}
.ac-around {align-content: space-around;}
.ac-between {align-content: space-between;}

.d-n {display: none !important;}
.d-i {display: inline !important;}
.d-ib {display: inline-block !important;}
.d-b {display: block !important;}
.d-t {display: table !important;}
.d-t-r {display: table-row !important;}
.d-t-c {display: table-cell !important;}
.d-f {
display: -ms-flexbox !important;
display: flex !important;
}
.d-i-f {
display: -ms-inline-flexbox !important;
display: inline-flex !important;
}

/* gap */
.gap-20 {gap: min(1.5vw,20px);}
.gap-40 {gap: min(3vw,40px);}
.gap-60 {gap: min(4.5vw,60px);}



/* ------------
padding
------------ */
.pd-0 {padding: 0!important;}
.pd-1 {padding: 1rem;}
.pd-2 {padding: 2rem;}
.pd-3 {padding: 3rem;}

/* top */
.pt-0{ padding-top:0!important;}
.pt-02{ padding-top:.2rem;}
.pt-05{ padding-top:.5rem;}
.pt-1{ padding-top:1rem!important;}
.pt-2{ padding-top:2rem;}
.pt-3{ padding-top:3rem;}
.pt-4{ padding-top:4rem;}
.pt-5{ padding-top:5rem;}
.pt-6{ padding-top:6rem;}

/* bottom */
.pb-0{ padding-bottom:0!important;}
.pb-02{ padding-bottom:.2rem;}
.pb-05{ padding-bottom:.5rem;}
.pb-1{ padding-bottom:1rem!important;}
.pb-2{ padding-bottom:2rem;}
.pb-3{ padding-bottom:3rem;}
.pb-4{ padding-bottom:4rem;}
.pb-5{ padding-bottom:5rem;}
.pb-6{ padding-bottom:6rem;}

/* left */
.pl-0{ padding-left:0!important;}
.pl-02{ padding-left:.2rem;}
.pl-05{ padding-left:.5rem;}
.pl-1{ padding-left:1rem;}
.pl-2{ padding-left:2rem;}
.pl-3{ padding-left:3rem;}
.pl-4{ padding-left:4rem;}
.pl-5{ padding-left:5rem;}
.pl-6{ padding-left:6rem;}

/* right */
.pr-0{ padding-right:0!important;}
.pr-02{ padding-right:.2rem;}
.pr-05{ padding-right:.5rem;}
.pr-1{ padding-right:1rem;}
.pr-2{ padding-right:2rem;}
.pr-3{ padding-right:3rem;}
.pr-4{ padding-right:4rem;}
.pr-5{ padding-right:5rem;}
.pr-6{ padding-right:6rem;}










/* ------------
margin
------------ */
.mg-0 { margin: 0!important;}

/* top */
.mt-0{ margin-top:0!important;}
.mt-02{ margin-top:.2em!important;}
.mt-05{ margin-top:.5em!important;}
.mt-1{ margin-top:1em!important;}
.mt-2{ margin-top:2em!important;}
.mt-3{ margin-top:3em!important;}
.mt-4{ margin-top:4em!important;}
.mt-5{ margin-top:5em!important;}
.mt-6{ margin-top:6em!important;}

/* bottom */
.mb-0{ margin-bottom:0!important;}
.mb-02{ margin-bottom:.2em!important;}
.mb-05{ margin-bottom:.5em!important;}
.mb-1{ margin-bottom:1em!important;}
.mb-2{ margin-bottom:2em!important;}
.mb-3{ margin-bottom:3em!important;}
.mb-4{ margin-bottom:4em!important;}
.mb-5{ margin-bottom:5em!important;}
.mb-6{ margin-bottom:6em!important;}

/* left */
.ml-0{ margin-left:0!important;}
.ml-02{ margin-left:.2em!important;}
.ml-05{ margin-left:.5em!important;}
.ml-1{ margin-left:1em!important;}
.ml-2{ margin-left:2em!important;}
.ml-3{ margin-left:3em!important;}
.ml-4{ margin-left:4em!important;}
.ml-5{ margin-left:5em!important;}
.ml-6{ margin-left:6em!important;}

/* right */
.mr-0{ margin-right:0!important;}
.mr-02{ margin-right:.2em!important;}
.mr-05{ margin-right:.5em!important;}
.mr-1{ margin-right:1em!important;}
.mr-2{ margin-right:2em!important;}
.mr-3{ margin-right:3em!important;}
.mr-4{ margin-right:4em!important;}
.mr-5{ margin-right:5em!important;}
.mr-6{ margin-right:6em!important;}



/* ------------
align
------------ */
.t-center {text-align: center;}
.t-left {text-align: left!important;}
.t-right {text-align: right!important;}

.v-top { vertical-align: top!important; }
.v-middle { vertical-align: middle; }
.v-bottom { vertical-align: boyyom; }



/* ------------
floats
------------ */
.f-left {float: left;}
.f-right {float: right;}



/* ------------
width
------------ */
.w-100 {width: 100%!important;}
.w-75 {width: 75%!important;}
.w-50 {width: 50%!important;}
.w-25 {width: 25%!important;}



@media only screen and (max-width:768px) {
.mt-0-sp {margin-top: 0!important;}
.mt-1-sp {margin-top: 1rem!important;}
.mt-2-sp {margin-top: 2rem!important;}
.mb-1-sp {margin-bottom: 1rem!important;}
.mb-2-sp {margin-bottom: 2rem!important;}
.pd-0-sp {padding: 0;}
.pt-0-sp {padding-top: 0;}
.pt-1-sp {padding-top: 1rem;}
.pb-0-sp {padding-bottom: 0;}
.pl-0-sp {padding-left: 0;}
.pr-0-sp {padding-right: 0;}

.w-100-sp {width: 100%!important;}

}/* max-width: 768px */




/*media Queries (374px) : -sm-
------------------------------------------------------------------------*/

@media only screen and (max-width: 374px) {
.d-n-sm {display: none !important;}
.d-i-sm {display: inline !important;}
.d-ib-sm {display: inline-block !important;}
.d-b-sm {display: block !important;}
.d-t-sm {display: table !important;}
.d-t-r-sm {display: table-row !important;}
.d-t-c-sm {display: table-cell !important;}
.d-f-sm {
display: -ms-flexbox !important;
display: flex !important;
}
.d-i-f-sm {
display: -ms-inline-flexbox !important;
display: inline-flex !important;
}
}/* max-width: 374px */




/*media Queries (768px) : -md-
------------------------------------------------------------------------*/

@media only screen and (min-width: 768px) {
article,nav,header,footer {
font-size: var(--font-size-md);
line-height: 1.8;
}
.container {
padding: 40px 0 30px;
}
.col-1,.col-2,.col-3,.col-4,.col-5,.col-6,.col-7,.col-8,.col-9,.col-10,.col-11,.col-12,.col {
padding: min(1.5vw,30px);
}

.col-1 {width: 8.333333%;}
.col-2 {width: 16.666667%;}
.col-3 {width: 25%;}
.col-4 {width: 33.333333%;}
.col-5 {width: 41.666667%;}
.col-6 {width: 50%;}
.col-7 {width: 58.333333%;}
.col-8 {width: 66.666667%;}
.col-9 {width: 75%;}
.col-10 {width: 83.333333%;}
.col-11 {width:91.666667%;}
.col-12 {width: 100%;}

.wrapper.w-full .col-1,
.wrapper.w-full .col-2,
.wrapper.w-full .col-3,
.wrapper.w-full .col-4,
.wrapper.w-full .col-5,
.wrapper.w-full .col-6,
.wrapper.w-full .col-7,
.wrapper.w-full .col-8,
.wrapper.w-full .col-9,
.wrapper.w-full .col-10,
.wrapper.w-full .col-11,
.wrapper.w-full .col-12,
.wrapper.w-full .col {
padding: 30px 0;
}

.wrapper.w-full .pr-30px-md {padding-right: 30px;}
.wrapper.w-full .pl-30px-md {padding-left: 30px;}

.d-n-md {display: none !important;}
.d-i-md {display: inline !important;}
.d-ib-md {display: inline-block !important;}
.d-b-md {display: block !important;}
.d-t-md {display: table !important;}
.d-t-r-md {display: table-row !important;}
.d-t-c-md {display: table-cell !important;}
.d-f-md {
display: -ms-flexbox !important;
display: flex !important;
}
.d-i-f-md {
display: -ms-inline-flexbox !important;
display: inline-flex !important;
}
.t-center-md {
text-align: center;
}

}/*min-width: 640px */






/*media Queries (1025px) : -lg-
------------------------------------------------------------------------*/
@media only screen and (min-width: 1025px) {
.d-n-lg {display: none !important;}
.d-i-lg {display: inline !important;}
.d-ib-lg {display: inline-block !important;}
.d-b-lg {display: block !important;}
.d-t-lg {display: table !important;}
.d-t-r-lg {display: table-row !important;}
.d-t-c-lg {display: table-cell !important;}
.d-f-lg {
display: -ms-flexbox !important;
display: flex !important;
}
.d-i-f-lg {
display: -ms-inline-flexbox !important;
display: inline-flex !important;
}

}/* min-width: 1025px */





/*media Queries (1340px) : -xl-
------------------------------------------------------------------------*/
@media only screen and (min-width: 1320px) {

.wrapper {
max-width: 1320px;
}
.wrapper.w-full {
max-width: 100%;
}
article,nav,header,footer {
font-size: var(--font-size-xl);
}
.d-n-xl {display: none !important;}
.d-i-xl {display: inline !important;}
.d-ib-xl {display: inline-block !important;}
.d-b-xl {display: block !important;}
.d-t-xl {display: table !important;}
.d-t-r-xl {display: table-row !important;}
.d-t-c-xl {display: table-cell !important;}
.d-f-xl {
display: -ms-flexbox !important;
display: flex !important;
}
.d-i-f-xl {
display: -ms-inline-flexbox !important;
display: inline-flex !important;
}




}/* min-width: 1340px */





/* ------------
font
------------ */
.fs-10 { font-size:min(2.4vw,var(--10px));}
.fs-11 { font-size:min(2.5vw,var(--11px));}
.fs-12 { font-size:min(2.6vw,var(--12px));}
.fs-13 { font-size:min(2.7vw,var(--13px));}
.fs-14 { font-size:min(2.8vw,var(--14px));}
.fs-15 { font-size:min(3vw,var(--15px));}
.fs-16 { font-size:min(3.2vw,var(--16px));}
.fs-18 { font-size:min(3.4vw,var(--18px));}
.fs-20 { font-size:min(3.8vw,var(--20px));}
.fs-22 { font-size:min(4.2vw,var(--22px));}
.fs-24 { font-size:min(4.5vw,var(--24px));}

.small{ font-size: 82%;}
.smaller {font-size: 71%;}
.big {font-size: 106%;}
.bigger {font-size: 141%;}

.fw-bold { font-weight:700;}
.fw-normal { font-weight:300;}
.fw-thin { font-weight:100;}
.fw-100{font-weight:100}
.fw-300{font-weight:300}
.fw-400{font-weight:400}
.fw-500{font-weight:500}
.fw-600{font-weight:600}
.fw-700{font-weight:700}
.fw-900{font-weight:900}

.ls-1 { letter-spacing:0.1em;}
.ls-2 { letter-spacing:0.2em;}
.ls--02 { letter-spacing:-0.02em!important;}
.ls--05 { letter-spacing:-0.05em!important;}
.ls--1 { letter-spacing:-0.1em!important;}
.ls--2 { letter-spacing:-0.2em!important;}
.ls-0 { letter-spacing: normal!important;}

.lh-10 { line-height: 1.0 }
.lh-11 { line-height: 1.1 }
.lh-12 { line-height: 1.2 }
.lh-14 { line-height: 1.4 }
.lh-16 { line-height: 1.6 }
.lh-18 { line-height: 1.8 }
.lh-20 { line-height: 2.0 }

/* ------------
color
------------ */
.t-white { color: #FFF; }
.t-red {color: var(--red);}
.bg-white {background: #FFF;}
.bg-gray {background: var(--gray10);}
.bg-blue {background: var(--blue10);}

/* ------------
list
------------ */
ul,ol {
list-style: none;
margin: 0;
padding: 0;
}
/* nest */
dl dl, dl ol, dl ul, ol dl, ul dl {margin: 0;}
ol ol, ol ul, ul ol, ul ul {margin: 0;}

ul.disc,ol.disc {
text-align: left;
margin-bottom: 1rem;
}
ul.disc li,ol.disc li {
margin-bottom: .3em;
position: relative;
padding: 0rem 1rem 0rem 2.5rem;
}
ul.disc li:before,ol.disc li:before {
content: "";
position: absolute;
top:10px;
left:10px;
display: inline-block;
height: 5px;
width: 5px;
border-radius:50%;
background: var(--font-color);
}
ol.decimal {
text-align: left;
list-style: decimal;
margin-left: 1.5em;
}
ol.decimal li {
margin-bottom: .5em;
line-height: 1.5;
letter-spacing: 0.05em;
}



@media only screen and (max-width: 768px) {
.fs-13-sp { font-size:var(--13px);}
.fs-14-sp { font-size:var(--14px);}
.fs-15-sp { font-size:var(--15px);}
.fs-16-sp { font-size:var(--16px);}
.fs-18-sp { font-size:var(--18px);}
.fs-20-sp { font-size:var(--20px);}
.t-left-sp {text-align: left;}

.ls-0-sp { letter-spacing: normal!important;}

}