@charset "utf-8";








:root {

--font-family:YakuHanJP_Noto, "Noto Sans Japanese", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
--font-family-en:'Montserrat', sans-serif;
--font-family-min:'Noto Serif JP', serif;

--font-color:#FFF;

/*スマホ、タブレット、PC 基本フォントサイズ*/
--font-size-sp:13px;
--font-size-tb:15px;
--font-size-pc:16px;

/*フォントサイズ*/
--10px: 59%;	--11px: 65%;	--12px: 71%;
--13px: 76%;	--14px: 82%;	--15px: 88%;
--16px: 94%;	--17px: 100%;	--18px: 106%;
--19px: 112%;	--20px: 118%;	--21px: 124%;
--22px: 129%;	--23px: 135%;	--24px: 141%;
--25px: 147%;	--26px: 153%;	--27px: 159%;
--28px: 165%;	--29px: 171%;	--30px: 176%;
--31px: 182%;	--32px: 188%;	--33px: 194%;
--34px: 200%;	--35px: 206%;	--36px: 212%;
--37px: 218%;	--38px: 226%;	--39px: 229%;
--40px: 235%;

/*スマホ時のパディング値調整*/
--05em-sp:.25em;
--1em-sp:.5em;
--2em-sp:1em;
--3em-sp:1.5em;
--4em-sp:2em;
--5em-sp:2.5em;
--6em-sp:3em;

/*カラムサイズ*/
--col1:8.3333%;
--col2:16.6666%;
--col3:25%;
--col4:33.3333%;
--col5:41.6666%;
--col6:50%;
--col7:58.333%;
--col8:66.666%;
--col9:75%;
--col10:83.333%;
--col11:91.666%;
--col12:100%;

/*inner-wrapper内のカラムサイズ*/
--inner-col1:8.73%;
--inner-col2:17.46%;
--inner-col3:26.19%;
--inner-col4:34.92%;
--inner-col5:43.65%;
--inner-col6:52.38%;
--inner-col7:61.11%;
--inner-col8:69.84%;
--inner-col9:78.57%;
--inner-col10:87.3%;
--inner-col11:96.03%;
--inner-col12:104.76%;
}





















/* LP */
html{
font-size: 62.5%;
}
article,header,footer {
width:100%;
}

a {
text-decoration:none;
color: #fff;
}
a:visited {
color: #fff;
}
a:hover {
color: #fff;
}
a img {
transition: opacity .3s;
}
a img:hover {
opacity: .8;
}

rt,rp {
/*font-size:9px;
-webkit-transform:scale(0.75);
letter-spacing: -0.25em;*/
font-size: 40%;
-webkit-transform:scale(0.8);
letter-spacing: -0.15em;
}
rp{
/*padding:0 .25em;*/
padding:0;
}
ruby {
ruby-overhang: auto;
ruby-align:center;
ruby-position: inline;
}

img{max-width: 100%;}


/* margin */
.mt-0{ margin-top: 0!important; }
.mt-02em{ margin-top: .2rem; }
.mt-05em{ margin-top: .5rem!important; }
.mt-1em{ margin-top: 1rem!important; }
.mt-2em{ margin-top: 2rem!important; }
.mt-3em{ margin-top: 3rem!important; }
.mt-4em{ margin-top: 4rem!important; }
.mt-5em{ margin-top: 5rem!important; }
.mt-6em{ margin-top: 6rem!important; }
.mt-7em{ margin-top: 7rem!important; }
.mt-8em{ margin-top: 8rem!important; }
.mr-0{ margin-right: 0!important; }
.mr-02em{ margin-right: .2rem; }
.mr-05em{ margin-right: .5rem; }
.mr-1em{ margin-right: 1rem; }
.mr-2em{ margin-right: 2rem; }
.mr-3em{ margin-right: 3rem; }
.mr-4em{ margin-right: 4rem; }
.mb-0{ margin-bottom: 0 !important; }
.mb-05em{ margin-bottom: .5rem; }
.mb-1em{ margin-bottom: 1rem!important; }
.mb-2em{ margin-bottom: 2rem!important; }
.mb-3em{ margin-bottom: 3rem!important; }
.mb-4em{ margin-bottom: 4rem!important; }
.mb-5em{ margin-bottom: 5rem!important; }
.mb-6em{ margin-bottom: 6rem!important; }
.ml-0{ margin-left: 0!important; }
.ml-02em{ margin-left: .2rem; }
.ml-05em{ margin-left: .5rem; }
.ml-1em{ margin-left: 1rem; }
.ml-2em{ margin-left: 2rem; }
.ml-3em{ margin-left: 3rem; }
.ml-4em{ margin-left: 4rem; }
.margin-0{margin: 0!important;}

/* padding */
.pt-0{ padding-top: 0 !important; }
.pt-05em{ padding-top: .5rem; }
.pt-1em{ padding-top: 1rem!important; }
.pt-2em{ padding-top: 2rem!important; }
.pt-3em{ padding-top: 3rem; }
.pt-4em{ padding-top: 4rem; }
.pt-5em{ padding-top: 5rem; }
.pt-6em{ padding-top: 6rem; }
.pr-02em{ padding-right: .2rem; }
.pr-05em{ padding-right: .5rem; }
.pr-1em{ padding-right: 1rem; }
.pr-2em{ padding-right: 2rem; }
.pr-3em{ padding-right: 3rem; }
.pr-4em{ padding-right: 4rem; }
.pb-0{ padding-bottom: 0 !important; }
.pb-05em{ padding-bottom: .5rem; }
.pb-1em{ padding-bottom: 1rem !important; }
.pb-2em{ padding-bottom: 2rem !important; }
.pb-3em{ padding-bottom: 3rem; }
.pb-4em{ padding-bottom: 4rem; }
.pb-5em{ padding-bottom: 5rem; }
.pb-6em{ padding-bottom: 6rem; }
.pl-02em{ padding-left: .2rem; }
.pl-05em{ padding-left: .5rem; }
.pl-1em{ padding-left: 1rem; }
.pl-2em{ padding-left: 2rem; }
.pl-3em{ padding-left: 3rem; }
.pl-4em{ padding-left: 4rem; }
.padding-0{padding: 0!important;}


.mb-05em-sp{ margin-bottom: .5rem; }
.mt-1em-sp{ margin-top: 1rem; }
.mt-2em-sp{ margin-top: 2rem; }
.mb-1em-sp{ margin-bottom: 1rem; }
.mb-2em-sp{ margin-bottom: 2rem; }
.pt-1em-sp{ padding-top: 1rem; }


/* Container */
.wrapper{
width: 100%;
display: block;
position:relative;
margin:0 auto;
/*letter-spacing: -0.4em; i-b 隙間埋め用 */
letter-spacing: -0.5em;
display: block\9; /* i-b 隙間埋め用 IE 8,9対応 */
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
text-align: center;
}
.wrapper:after{
content:"";
display: block;
clear:both;
box-sizing: border-box;
}
.wrapper-beige{
background: url(../images/beige.svg) repeat-y;
}
.wrapper-white{
background: url(../images/white.svg) repeat-y;
}
.wrapper-beige, .wrapper-white{
background-size: 100%;
padding:10px;
box-sizing:border-box;
}
.col1,.col2,.col3,.col4,.col5,.col5harf,.col6,
.col7,.col8,.col9,.col10,.col11,.col12{
display:inline-block;
vertical-align:middle;
position: relative;
margin-left: 2.08%;
margin-right: 2.08%;
margin-top:10px;
margin-bottom:10px;
width:95.8318%;
letter-spacing: normal;/* i-b 隙間埋め用 */
box-sizing: border-box;
line-height:1.6;
}


/* display */
.db{display: block;}
.di{display: inline;}
.dib{display: inline-block;}
.dt{display: table !important;}
.dtc{display: table-cell !important;vertical-align:middle;}

/* box move */
.right{ margin-left:auto; margin-right:0; }
.left{ margin-left:0; margin-right:auto; }
.center{ margin-right:auto; margin-left: auto; }

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

/* v-align */
.vertical-top{ vertical-align: top; }
.vertical-bottom{ vertical-align: bottom; }

/* float */
.fl{ float:left; }
.fr{ float:right; }
.fi{ float:inherit; text-align: center;}

/* on off */
/*.on-sp { display:block; }*/
.on-sp { display:inline-block; }
.off-sp { display:none; }
.on-tb { display:none; }
.off-tb { display:none; }
.on-pc { display:none; }
.off-pc { display:inline-block; }


@media screen and (min-width:768px) {

/* on off */
.on-sp { display:none!important; }
.off-sp { display:inline-block; }
.on-tb { display:inline-block; }
.off-tb { display:none; }
.on-pc { display:none!important; }
.off-pc { display:inline-block; }

.mb-0-tb{ margin-bottom: 0!important; }
.mb-05em-sp{ margin-bottom: 0; }
.mt-1em-tb{ margin-top: 1em; }
.mt-1em-sp{ margin-top: 0; }
.mt-2em-sp{ margin-top: 0; }
.mb-1em-sp{ margin-bottom: 0; }
.mb-2em-sp{ margin-bottom: 0; }
.mt-2em-tb{ margin-top: 2em!important; }
.mb-2em-tb{ margin-bottom: 2em; }
.ml-1em-tb{ margin-left: 1em; }
.pt-1em-sp{ padding-top: 0; }

.wrapper-beige, .wrapper-white{
background-size: 95.8318%;
background-position: center center;
}

/* column*/
.col1,.col2,.col3,.col4,.col5,.col5harf,.col6,
.col7,.col8,.col9,.col10,.col11,.col12 {
margin-top:20px;
margin-bottom:20px;
}
.col1 { width:4.168%; }
.col2 { width:12.5%; }
.col3 { width:20.835%; }
.col4 { width:29.168%; }
.col5 { width:37.5%; }
.col5harf { width:41.668%; }
.col6 { width:45.83%; }
.col7 { width:54.168%; }
.col8 { width:62.5%; }
.col9 { width:70.835%; }
.col10 { width:79.168%; }
.col11 { width:87.5%; }
.col12 { width:95.8318%; }
.col100 { width:100.0%; }


}/*@media screen and (min-width:768px)*/


@media screen and (min-width:960px) {

.wrapper{
max-width: 960px;
}

/* on off */
.off-tb { display:inline-block; }
.on-pc { display:inline-block!important; }
.off-pc { display:none; }


}/*@media screen and (min-width:960px)*/



@media screen and (max-width:767px) {

.col2-sp { width:12.5%; }
.col3-sp { width:20.835%; }
.col4-sp { width:29.1662%; }
.col5-sp { width:37.5%; }
.col6-sp { width:45.8326%; }
.col7-sp { width:54.168%; }
.col8-sp { width:62.5%; }
.col9-sp { width:62.5%; }
.col10-sp { width:79.168%; }
.col11-sp { width:87.5%; }

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



/* basic design */

/* Text */
.small { font-size:80%; }
.smaller { font-size:70%; }
.big{font-size: 115%; }
.bigger{font-size: 125%; }
.big-18{font-size: 160%; }
.strong{font-weight: 600; }
.normal { font-weight: normal;}
.caption{ font-size:80%; padding-top:1rem; }
/*
*/
#pagetop { position:fixed; bottom:20px; right:20px; cursor:pointer; opacity:0.8; }

.sup{
font-size:70%;
vertical-align: super;
}
.sub{
font-size:70%;
}

ul.list-circle, ul.list-decimal{
list-style-type: circle;
list-style-position:outside;
padding-left: 1.5rem;
}
ul.list-circle li, ul.list-decimal li{
margin-bottom: .5em;
}
ul.list-decimal{
list-style-type: decimal;
}
ul.list-decimal{
list-style-type: decimal;
}