@charset "utf-8";

/*----------------------------------------------------
elements
----------------------------------------------------*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video
{
font-family: 'Noto Serif JP', 'ヒラギノ明朝 Pro W3','Hiragino Mincho Pro','ＭＳ Ｐ明朝','MS PMincho',serif;
color: #333;
-webkit-text-size-adjust: none;
}

html {
font-size: 62.5%;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
-ms-text-size-adjust: 100%;
-webkit-text-size-adjust: 100%;
overflow:auto;
}

body {
background-color: #fff;
font-size: 1.2rem;
line-height: 1.6;
overflow: hidden;
}

/*===== for   OVER - 859px =====*/
@media screen and (min-width:859px){
body {
font-size: 1.6rem;
}
}




.min {
-webkit-text-size-adjust: none; /* フォントサイズ自動調整 */
font-family: 'Noto Serif JP', 'ヒラギノ明朝 Pro W3','Hiragino Mincho Pro','ＭＳ Ｐ明朝','MS PMincho',serif;
color: #333;
}


a {
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
text-decoration: none;
}

img {
vertical-align: bottom;
}

li {
list-style: none;
}

/*
====================================================
clearfix
====================================================
*/
.clearfix:after { content: ''; display: block; clear: both; }

.cf {overflow: hidden;}

.clear{
clear:both;
font-size:0;
line-height:0;
padding:0;
margin:0;
}

.clearB {clear: both;}

/* ================================================
align settings
================================================== */
.alignC, .center {
text-align:center!important;
}
.alignL {
text-align:left !important;
}
.alignR {
text-align:right !important;
}

/* ================================================
float settings
================================================== */
.floatL {
float:left;
}
.floatR {
float:right;
}

/* ================================================
font family
================================================== */
.GothicTxt {
font-family: 'Noto Sans SC', 'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック','MS PGothic',sans-serif;
}

/* ================================================
font note
================================================== */
.noteTxt, .attention {
font-size:10px;
line-height:1.4;
}
ul.noteTxt li {
font-size:10px;
line-height:1.4;
padding-left:1em;
text-indent:-1em;
}

.noteTxtGray {
font-size:10px;
line-height:1.4;
color:#666;
}
ul.noteTxtGray li {
font-size:10px;
line-height:1.4;
color:#666;
padding-left:1em;
text-indent:-1em;
}

/* ================================================
font weight
================================================== */
.b {
font-weight: bold;
}
.normal {
font-weight: normal;
}

/* ================================================
font color
================================================== */
.red {
color: #AC0B27;
}
.blue {
color: #003F97;
}

sup {
font-size: 50%;
vertical-align: super;
}


/* ================================================
矢印
================================================== */
/*黒矢印*/
.arrow{
position: relative;
display: inline-block;
padding: 0 0 0 16px;
color: #000;
vertical-align: middle;
text-decoration: none;
transition:0.3s;
}
.arrow::before,
.arrow::after{
position: absolute;
top: -1px;
bottom: 0;
left: 0;
margin: auto;
content: "";
vertical-align: middle;
}
.arrow::before{
width: 4px;
height: 4px;
border-top: 1px solid #000;
border-right: 1px solid #000;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
transition:0.3s;
}
.arrow:hover::before{
left:2px;
}
/*白矢印*/
.arrow_w{
position: relative;
display: inline-block;
padding: 0 0 0 16px;
color: #fff;
vertical-align: middle;
text-decoration: none;
transition:0.3s;
}
.arrow_w::before,
.arrow_w::after{
position: absolute;
top: -1px;
bottom: 0;
left: 0;
margin: auto;
content: "";
vertical-align: middle;
}
.arrow_w::before{
width: 4px;
height: 4px;
border-top: 1px solid #fff;
border-right: 1px solid #fff;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
transition:0.3s;
}
.arrow_w:hover::before{
left:2px;
}


/* ================================================
ボタン「」
================================================== */
.button-wrap {
padding: 0;
margin: 30px 0 60px;
font-weight: 500;
background: transparent;
outline: none !important;
cursor: pointer;
transition: all 0.3s ease;
position: relative;
display: inline-block;
text-align: center;
width: 350px;
max-width: 350px;
/*padding: 0;*/
border: none;
}
.button-wrap span {
position: relative;
display: block;
width: 100%;
height: 100%;
line-height: 45px;
}
.button-wrap:before,
.button-wrap:after {
position: absolute;
content: "";
right: 0;
bottom: 0;
background: #000;
transition: all 0.3s ease;
}
.button-wrap:before {
height: 50%;
width: 1px;
}
.button-wrap:after {
width: 20%;
height: 1px;
}
/*.button-wrap:hover:before {
height: 100%;
}
.button-wrap:hover:after {
width: 100%;
}
*/
a:hover .button-wrap:before {
height: 100%;
}
a:hover .button-wrap:after {
width: 100%;
}
.button-wrap span:before,
.button-wrap span:after {
position: absolute;
content: "";
left: 0;
top: 0;
background: #000;
transition: all 0.3s ease;
}
.button-wrap span:before {
width: 1px;
height: 50%;
}
.button-wrap span:after {
width: 20%;
height: 1px;
}
/*.button-wrap span:hover:before {
height: 100%;
}
.button-wrap span:hover:after {
width: 100%;
}
*/
a:hover .button-wrap span:before {
height: 100%;
}
a:hover .button-wrap span:after {
width: 100%;
}
.button-wrap img {
height:13px;
vertical-align: -2px;
}



/* ================================================
caption
================================================== */
.rela {
position: relative;
}
span.caption {
position: absolute;
bottom: 7px;
font-size: 11px !important;
letter-spacing: 1px;
}
.cap_W {
color: #fff;
text-shadow:0px 0px 5px #000000,0px 0px 10px #2e2e2e;
}
.cap_B {
color: #000;
text-shadow:0px 0px 5px #fff,0px 0px 10px #fff;
}
.cap_R {
right: 7px;
}
.cap_L {
left: 7px;
}
/*        860px以下　SP　背景動画
=========================================*/
@media only screen and (max-width: 860px) {
span.caption {
bottom: 7px;
right: 5px;
}
}


/* ================================================
table
================================================== */
table {
border-collapse: collapse;
border-spacing: 0px;
}





/* -------------------------------
for smartphone
960px以内
------------------------------- */
@media only screen and (max-width : 860px ){

.pc { display: none;}
.sp { display:block;}

/* ================================================
margin settings
================================================== */
.sp_mrgT0 { margin-top : 0px !important; }
.sp_mrgT5 { margin-top : 5px !important; }
.sp_mrgT10 { margin-top : 10px !important; }
.sp_mrgT15 { margin-top : 15px !important; }
.sp_mrgT20 { margin-top : 20px !important; }
.sp_mrgT25 { margin-top : 25px !important; }
.sp_mrgT30 { margin-top : 30px !important; }
.sp_mrgT35 { margin-top : 35px !important; }
.sp_mrgT40 { margin-top : 40px !important; }
.sp_mrgT45 { margin-top : 45px !important; }
.sp_mrgT50 { margin-top : 50px !important; }
.sp_mrgT55 { margin-top : 55px !important; }
.sp_mrgT60 { margin-top : 60px !important; }
.sp_mrgT65 { margin-top : 65px !important; }
.sp_mrgT70 { margin-top : 70px !important; }
.sp_mrgT75 { margin-top : 75px !important; }
.sp_mrgT80 { margin-top : 80px !important; }
.sp_mrgT85 { margin-top : 85px !important; }
.sp_mrgT90 { margin-top : 90px !important; }
.sp_mrgT95 { margin-top : 95px !important; }
.sp_mrgT100 { margin-top : 100px !important; }

.sp_mrgR0 { margin-right : 0px !important; }
.sp_mrgR10 { margin-right : 10px !important; }
.sp_mrgR15 { margin-right : 15px !important; }
.sp_mrgR20 { margin-right : 20px !important; }
.sp_mrgR25 { margin-right : 25px !important; }
.sp_mrgR30 { margin-right : 30px !important; }
.sp_mrgR35 { margin-right : 35px !important; }
.sp_mrgR40 { margin-right : 40px !important; }
.sp_mrgR45 { margin-right : 45px !important; }
.sp_mrgR50 { margin-right : 50px !important; }
.sp_mrgR55 { margin-right : 55px !important; }
.sp_mrgR60 { margin-right : 60px !important; }
.sp_mrgR65 { margin-right : 65px !important; }
.sp_mrgR70 { margin-right : 70px !important; }
.sp_mrgR75 { margin-right : 75px !important; }
.sp_mrgR80 { margin-right : 80px !important; }
.sp_mrgR85 { margin-right : 85px !important; }
.sp_mrgR90 { margin-right : 90px !important; }
.sp_mrgR95 { margin-right : 95px !important; }
.sp_mrgR100 { margin-right : 100px !important; }

.sp_mrgB0 { margin-bottom : 0px !important; }
.sp_mrgB10 { margin-bottom : 10px !important; }
.sp_mrgB15 { margin-bottom : 15px !important; }
.sp_mrgB20 { margin-bottom : 20px !important; }
.sp_mrgB25 { margin-bottom : 25px !important; }
.sp_mrgB30 { margin-bottom : 30px !important; }
.sp_mrgB35 { margin-bottom : 35px !important; }
.sp_mrgB40 { margin-bottom : 40px !important; }
.sp_mrgB45 { margin-bottom : 45px !important; }
.sp_mrgB50 { margin-bottom : 50px !important; }
.sp_mrgB55 { margin-bottom : 55px !important; }
.sp_mrgB60 { margin-bottom : 60px !important; }
.sp_mrgB65 { margin-bottom : 65px !important; }
.sp_mrgB70 { margin-bottom : 70px !important; }
.sp_mrgB75 { margin-bottom : 75px !important; }
.sp_mrgB80 { margin-bottom : 80px !important; }
.sp_mrgB85 { margin-bottom : 85px !important; }
.sp_mrgB90 { margin-bottom : 90px !important; }
.sp_mrgB95 { margin-bottom : 95px !important; }
.sp_mrgB100 { margin-bottom : 100px !important; }

.sp_mrgL0 { margin-left : 0px !important; }
.sp_mrgL10 { margin-left : 10px !important; }
.sp_mrgL15 { margin-left : 15px !important; }
.sp_mrgL20 { margin-left : 20px !important; }
.sp_mrgL25 { margin-left : 25px !important; }
.sp_mrgL30 { margin-left : 30px !important; }
.sp_mrgL35 { margin-left : 35px !important; }
.sp_mrgL40 { margin-left : 40px !important; }
.sp_mrgL45 { margin-left : 45px !important; }
.sp_mrgL50 { margin-left : 50px !important; }
.sp_mrgL55 { margin-left : 55px !important; }
.sp_mrgL60 { margin-left : 60px !important; }
.sp_mrgL65 { margin-left : 65px !important; }
.sp_mrgL70 { margin-left : 70px !important; }
.sp_mrgL75 { margin-left : 75px !important; }
.sp_mrgL80 { margin-left : 80px !important; }
.sp_mrgL85 { margin-left : 85px !important; }
.sp_mrgL90 { margin-left : 90px !important; }
.sp_mrgL95 { margin-left : 95px !important; }
.sp_mrgL100 { margin-left : 100px !important; }

}


/* -------------------------------
for pc
769～960px以上
------------------------------- */
@media only screen and (min-width : 861px ){

.pc { display: block;}
.sp { display: none;}

/* ================================================
margin settings
================================================== */
.pc_mrgT0 { margin-top : 0px !important; }
.pc_mrgT5 { margin-top : 5px !important; }
.pc_mrgT10 { margin-top : 10px !important; }
.pc_mrgT15 { margin-top : 15px !important; }
.pc_mrgT20 { margin-top : 20px !important; }
.pc_mrgT25 { margin-top : 25px !important; }
.pc_mrgT30 { margin-top : 30px !important; }
.pc_mrgT35 { margin-top : 35px !important; }
.pc_mrgT40 { margin-top : 40px !important; }
.pc_mrgT45 { margin-top : 45px !important; }
.pc_mrgT50 { margin-top : 50px !important; }
.pc_mrgT55 { margin-top : 55px !important; }
.pc_mrgT60 { margin-top : 60px !important; }
.pc_mrgT65 { margin-top : 65px !important; }
.pc_mrgT70 { margin-top : 70px !important; }
.pc_mrgT75 { margin-top : 75px !important; }
.pc_mrgT80 { margin-top : 80px !important; }
.pc_mrgT85 { margin-top : 85px !important; }
.pc_mrgT90 { margin-top : 90px !important; }
.pc_mrgT95 { margin-top : 95px !important; }
.pc_mrgT100 { margin-top : 100px !important; }

.pc_mrgR0 { margin-right : 0px !important; }
.pc_mrgR10 { margin-right : 10px !important; }
.pc_mrgR15 { margin-right : 15px !important; }
.pc_mrgR20 { margin-right : 20px !important; }
.pc_mrgR25 { margin-right : 25px !important; }
.pc_mrgR30 { margin-right : 30px !important; }
.pc_mrgR35 { margin-right : 35px !important; }
.pc_mrgR40 { margin-right : 40px !important; }
.pc_mrgR45 { margin-right : 45px !important; }
.pc_mrgR50 { margin-right : 50px !important; }
.pc_mrgR55 { margin-right : 55px !important; }
.pc_mrgR60 { margin-right : 60px !important; }
.pc_mrgR65 { margin-right : 65px !important; }
.pc_mrgR70 { margin-right : 70px !important; }
.pc_mrgR75 { margin-right : 75px !important; }
.pc_mrgR80 { margin-right : 80px !important; }
.pc_mrgR85 { margin-right : 85px !important; }
.pc_mrgR90 { margin-right : 90px !important; }
.pc_mrgR95 { margin-right : 95px !important; }
.pc_mrgR100 { margin-right : 100px !important; }

.pc_mrgB0 { margin-bottom : 0px !important; }
.pc_mrgB10 { margin-bottom : 10px !important; }
.pc_mrgB15 { margin-bottom : 15px !important; }
.pc_mrgB20 { margin-bottom : 20px !important; }
.pc_mrgB25 { margin-bottom : 25px !important; }
.pc_mrgB30 { margin-bottom : 30px !important; }
.pc_mrgB35 { margin-bottom : 35px !important; }
.pc_mrgB40 { margin-bottom : 40px !important; }
.pc_mrgB45 { margin-bottom : 45px !important; }
.pc_mrgB50 { margin-bottom : 50px !important; }
.pc_mrgB55 { margin-bottom : 55px !important; }
.pc_mrgB60 { margin-bottom : 60px !important; }
.pc_mrgB65 { margin-bottom : 65px !important; }
.pc_mrgB70 { margin-bottom : 70px !important; }
.pc_mrgB75 { margin-bottom : 75px !important; }
.pc_mrgB80 { margin-bottom : 80px !important; }
.pc_mrgB85 { margin-bottom : 85px !important; }
.pc_mrgB90 { margin-bottom : 90px !important; }
.pc_mrgB95 { margin-bottom : 95px !important; }
.pc_mrgB100 { margin-bottom : 100px !important; }

.pc_mrgL0 { margin-left : 0px !important; }
.pc_mrgL10 { margin-left : 10px !important; }
.pc_mrgL15 { margin-left : 15px !important; }
.pc_mrgL20 { margin-left : 20px !important; }
.pc_mrgL25 { margin-left : 25px !important; }
.pc_mrgL30 { margin-left : 30px !important; }
.pc_mrgL35 { margin-left : 35px !important; }
.pc_mrgL40 { margin-left : 40px !important; }
.pc_mrgL45 { margin-left : 45px !important; }
.pc_mrgL50 { margin-left : 50px !important; }
.pc_mrgL55 { margin-left : 55px !important; }
.pc_mrgL60 { margin-left : 60px !important; }
.pc_mrgL65 { margin-left : 65px !important; }
.pc_mrgL70 { margin-left : 70px !important; }
.pc_mrgL75 { margin-left : 75px !important; }
.pc_mrgL80 { margin-left : 80px !important; }
.pc_mrgL85 { margin-left : 85px !important; }
.pc_mrgL90 { margin-left : 90px !important; }
.pc_mrgL95 { margin-left : 95px !important; }
.pc_mrgL100 { margin-left : 100px !important; }

}
