@charset "utf-8";
/* CSS Document */
/* -------------------------------------------------------------------------- **
**  COMMON CSS
** -------------------------------------------------------------------------- */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100;200;300;400;500;600;700;800;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@200;300;400;500;600;700;900&display=swap');

html {
	margin: 0px;
	padding: 0px;
	font-family:'Noto Sans JP','メイリオ','Meiryo','ＭＳ Ｐゴシック','ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro', verdana, Helvetica,Arial, sans-serif;
	font-size:62.5%;
	font-weight: 400;
	font-feature-settings: "palt" 1;
    -webkit-appearance: none;
}

body {
	font-size: 1.0rem;
    line-height: 1.6;
	background: #FFF;
	text-align: center;
    overflow-x: hidden;
    padding-top: 95px;
}
.sp{
    display: none;
}
.pc{
    display: block;
}
small{
	font-size: 80%;
}
big{
	font-size: 115%;
}
img{
	vertical-align: bottom;
	width: 100%;
}

@media screen and (max-width: 1024px){
    html {
        font-size:62.5%;
        overflow-x:hidden !important;
    }
    body {
        width: 100vw;
        margin: 0;
        padding-top: 10vw;
        overflow-x:hidden !important;
    }
    .sp{
        display: none;
    }
    .pc{
        display: block;
    }
    #mainManu.pc{
        display: none;
    }
    #mobileMenu.sp{
        display: block;
    }
    
}
@media screen and (max-width: 767px){
    html {
        font-size:62.5%;
        overflow-x:hidden !important;
    }
    body {
        width: 100vw;
        margin: 0;
        padding-top: 18vw;
        overflow-x:hidden !important;
    }
    .pc{
        display: none;
    }
    .sp{
        display: block;
    }
}

/*-----------------------------------------
  images
-----------------------------------------*/
.imgTxt{
	text-indent:100%;
	white-space:nowrap;
	overflow:hidden;
	margin-left:auto;
	margin-right:auto;
	}


/*-----------------------------------------
  a
-----------------------------------------*/

a{
	outline:none;
	text-decoration: none;
    transition: 0.3s ease;
}
a:hover{
    transition: 0.3s ease;
}

strong {
	font-weight: 700;
}

a img {
   -webkit-backface-visibility: hidden;
   backface-visibility: hidden;
   -webkit-transition: 0.2s ease-in;
   transition: 0.2s ease-in;
   filter: alpha(opacity=100);
   opacity: 1;
}

.ie8 a img {
	-webkit-transition:none;
	-moz-transition:none;
	-o-transition:none;
	-ms-transition:none;
	transition:none;
}

a:hover img {
	opacity:0.75;
	filter:alpha(opacity=75);
	-ms-filter:"alpha(opacity=75)";
	-moz-opacity:0.75;
	-khtml-opacity:0.75;
	zoom:1;
}

.ie8 a:hover img {
	opacity:1;
	filter:alpha(opacity=100);
	-ms-filter:"alpha(opacity=100)";
	-moz-opacity:1;
	-khtml-opacity:1;
	zoom:1;
}


/*-----------------------------------------
 	fedein
-----------------------------------------*/
/*
.fedein{
    opacity: 0;
    visibility: hidden;
    transform: translateY(5em);
    transition: opacity 1s, visibility 1s, transform 1s;    
}

.fedein.is-fadein {
    opacity: 1;
    visibility: visible;
    transform: translateX(0);
}
*/

/*-----------------------------------------
 	font
-----------------------------------------*/
.text{line-height:1.6em;}
.t_bold{font-weight:bold;}
.t_uline{text-decoration:underline;}

/* ---------- size ---------- */
.t_size_d2{font-size:80%;}
.t_size_d1{font-size:90%;}
.t_size_u1{font-size:110%;}
.t_size_u2{font-size:120%;}
.t_size_u3{font-size:130%;}
.t_size_u4{font-size:140%;}
.t_size_u5{font-size:150%;}

/* ---------- color ---------- */
.tc_red{color:#FF0000;}
.tc_black{color:#161616;}
.tc_white{color:#FFF;}


/*-----------------------------------------
 	visual
-----------------------------------------*/
/* ---------- position ---------- */
.t_left{text-align:left;}
.t_center{text-align:center;}
.t_right{text-align:right;}
.m_auto{margin-left: auto;margin-right: auto;}

/* ---------- padding top ---------- */
.pt_1{padding-top:10px; display:block;}
.pt_2{padding-top:20px; display:block;}
.pt_3{padding-top:30px; display:block;}
.pt_4{padding-top:40px; display:block;}
.pt_5{padding-top:50px; display:block;}
.pt_6{padding-top:60px; display:block;}
.pt_7{padding-top:70px; display:block;}
.pt_8{padding-top:80px; display:block;}

/* ---------- padding bottom ---------- */
.pb_1{padding-bottom:10px; display:block;}
.pb_2{padding-bottom:20px; display:block;}
.pb_3{padding-bottom:30px; display:block;}
.pb_4{padding-bottom:40px; display:block;}
.pb_5{padding-bottom:50px; display:block;}
.pb_6{padding-bottom:60px; display:block;}
.pb_7{padding-bottom:70px; display:block;}
.pb_8{padding-bottom:80px; display:block;}

/* ---------- padding left ---------- */
.pl_1{padding-left:10px; display:block;}
.pl_2{padding-left:20px; display:block;}
.pl_3{padding-left:30px; display:block;}
.pl_4{padding-left:40px; display:block;}
.pl_5{padding-left:50px; display:block;}
.pl_6{padding-left:60px; display:block;}
.pl_7{padding-left:70px; display:block;}
.pl_8{padding-left:80px; display:block;}

/* ---------- padding right ---------- */
.pr_1{padding-right:10px; display:block;}
.pr_2{padding-right:20px; display:block;}
.pr_3{padding-right:30px; display:block;}
.pr_4{padding-right:40px; display:block;}
.pr_5{padding-right:50px; display:block;}
.pr_6{padding-right:60px; display:block;}
.pr_7{padding-right:70px; display:block;}
.pr_8{padding-right:80px; display:block;}

/* ---------- margin top ---------- */
.mt_1{margin-top:10px; display:block;}
.mt_2{margin-top:20px; display:block;}
.mt_3{margin-top:30px; display:block;}
.mt_4{margin-top:40px; display:block;}
.mt_5{margin-top:50px; display:block;}
.mt_6{margin-top:60px; display:block;}
.mt_7{margin-top:70px; display:block;}
.mt_8{margin-top:80px; display:block;}

/* ---------- margin bottom ---------- */
.mb_1{margin-bottom:10px; display:block;}
.mb_2{margin-bottom:20px; display:block;}
.mb_3{margin-bottom:30px; display:block;}
.mb_4{margin-bottom:40px; display:block;}
.mb_5{margin-bottom:50px; display:block;}
.mb_6{margin-bottom:60px; display:block;}
.mb_7{margin-bottom:70px; display:block;}
.mb_8{margin-bottom:80px; display:block;}

/* ---------- margin left ---------- */
.ml_1{margin-left:10px; display:block;}
.ml_2{margin-left:20px; display:block;}
.ml_3{margin-left:30px; display:block;}
.ml_4{margin-left:40px; display:block;}
.ml_5{margin-left:50px; display:block;}
.ml_6{margin-left:60px; display:block;}
.ml_7{margin-left:70px; display:block;}
.ml_8{margin-left:80px; display:block;}

/* ---------- margin right ---------- */
.mr_1{margin-right:10px; display:block;}
.mr_2{margin-right:20px; display:block;}
.mr_3{margin-right:30px; display:block;}
.mr_4{margin-right:40px; display:block;}
.mr_5{margin-right:50px; display:block;}
.mr_6{margin-right:60px; display:block;}
.mr_7{margin-right:70px; display:block;}
.mr_8{margin-right:80px; display:block;}

/*-----------------------------------------
 	other
-----------------------------------------*/
/*---clearfix---*/
.clearfix:after {
  content: "";
  clear: both;
  display: block;
}
.clear{clear: both;}

.pagetop {
    display: none;
    position: fixed;
    bottom: 30px;
    right: 15px;
    cursor: pointer;
}
.pagetop a {
    display: inline-block;
    background-color: #FF0000;
    text-align: center;
    color: #FFF;
    font-size: 1.4rem;
    text-decoration: none;
    width: 80px;
	height: 80px;
	padding-top: 20px;
	overflow: hidden;
	box-sizing: border-box;
    transition: .3s; 
    border-radius: 100%;
    border: 1px solid #FFF;
}
.pagetop a:before {
	content: "▲";
	width: 100%;
	height: 1em;
	margin-bottom: 0.5em;
	display: block;
	text-align: center;
}

.pagetop a:hover {
    opacity: 0.75;
}

@media screen and (max-width: 767px){
    .pagetop {
        bottom: 3vw;
        right: 3vw;
    }
    .pagetop a {
        font-size: 3vw;
        width: 18vw;
        height: 18vw;
        padding-top: 4.5vw;
    }
    .pagetop a:before {
        content: "▲";
        width: 100%;
        height: 1em;
        margin-bottom: 0.5em;
        display: block;
        text-align: center;
    }

    .pagetop a:hover {
        opacity: 0.75;
    }
}
@media screen and (max-width: 768px) and (max-width: 1024px){
    .pagetop {
        bottom: 3vw;
        right: 3vw;
    }
    .pagetop a {
        font-size: 2vw;
        width: 12vw;
        height: 12vw;
        padding-top: 2.5vw;
    }
    .pagetop a:before {
        content: "▲";
        width: 100%;
        height: 1em;
        margin-bottom: 0.5em;
        display: block;
        text-align: center;
    }

    .pagetop a:hover {
        opacity: 0.75;
    }
}