@charset "utf-8";
@import url(http://fonts.googleapis.com/earlyaccess/notosansjapanese.css);

@media screen and (max-width: 767px) {

body {
font-family: '-apple-system', 'BlinkMacSystemFont','Hiragino Sans','Hiragino Kaku Gothic ProN',"segoe ui",'游ゴシック Medium','メイリオ', Meiryo,'ＭＳ Ｐゴシック','MS PGothic',sans-serif;
color:#33333c;
font-weight: normal;
background-color:rgb(249,249,254);
-webkit-text-size-adjust: 100%;
}
#css{width:auto;}
img{
max-width: 100% ;
height: auto;
width:auto;
}
.pc_only{display:none;}
.sp_only{visibility :visible;}

/* ================================================================================ */

/*	wrapper	*/

/* ================================================================================ */
.wrapper{
width:100%;
margin:0 auto;
position: relative;
min-width: 300px;
min-height: 100%;
height: auto !important;
height: 100%;
margin: 0 auto -250px;
}
nav{z-index:105;}
/* ================================================================================ */
/*      header    */  
/* ================================================================================ */
header{
width:100%;
margin:0 auto;
padding:0;
height:auto;
position:relative;
}
header h1 span{
display:none;
}
.p_front header{
height:auto;
position:relative;
}
.header{
height:65px;
width:100%;
position:relative;
border-top:4px solid rgb(24,172,246);
box-sizing:border-box;
}
.header .wrap{
width:100%;
height:65px;
padding:10px;
margin:0 auto;
position:relative;
box-sizing:border-box;
}
/*logoset*/
.header .colm1{ 
width:240px;
height:45px;
z-index:5;
}
.header .colm1 h1 img{
vertical-align:bottom;
width:100%;
height:auto;
}

/* ================================================================================ */

/*	globalNavArea header (nav.css nav_drawer.css)	*/

/* ================================================================================ */

/* ================================================================================ */

/*	pan パンくず	*/

/* ================================================================================ */
.pan{
position:absolute;
top:200px;
width:100%;
margin:0 auto;
font-size:1.2rem;
font-family: "メイリオ", Meiryo,"游ゴシック", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", sans-serif;
z-index:2;
box-sizing:border-box;
}
.pan ul{
width:85%;
margin:12px auto 0;
box-sizing:border-box;
}
.pan ul > li{
display:inline-block;
color:rgba(170,168,168,1);
}
.pan ul > li{
position: relative;
display: inline-block;
padding: 0 0 0 16px;
vertical-align: middle;
text-decoration: none;
}
.pan ul > li::before,
.pan ul > li::after{
position: absolute;
top: 0;
bottom: 1px;
left: 0;
margin: auto;
content: "";
}
.pan ul > li::before{
left: 3px;
top:0;
width: 6px;
height: 6px;
border-top: 1px solid rgba(185,190,205,1) ;
border-right: 1px solid rgba(185,190,205,1) ;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
}
.pan ul > li:first-child::before{
border:none 0;
margin: 0;
position: relative;
top: 1px;
}
.pan ul > li:first-child{
padding:0;
}
.pan ul > li a{
text-decoration:none;
color:var(--second-color14);
}

/* ================================================================================ */

/*	contContainer	*/

/* ================================================================================ */
.contContainer {
width:90%;
margin:0px auto 0;
position:relative;
z-index:99;
}
h3,h4,h5{font-weight:bold;}

h3{font-size:1.8rem;margin:30px auto;}
h4,h5{margin:20px auto;}

/* ================================================================================ */

/*      footer     */  

/* ================================================================================ */
#push{height:250px;}

footer {
width:100%;
height:250px;
padding-bottom:0;
margin-bottom:0;
text-align:center;
color:#d5d5d5;
background: #717171; 
position:relative;
display: flex;
justify-content: center;
flex-direction: column;
align-items: center;
}

/*フッター メニューボタン*/

.footer_nav{
	width:100%;
margin:0 auto;
text-align:center;
box-sizing:border-box;
background:#414141;
display:none;
}
.footer_nav ul{font-size:0;color:#fff;}
.footer_nav ul li{
display: inline-block;
font-size:1.3rem;
line-height:1;
cursor: pointer;
position: relative;
}
.footer_nav ul li a{
z-index:10001;
display:block;
padding:0 1em 0 1.5em;
line-height:60px;
text-decoration:none;
box-sizing:border-box;
}
.footer_nav ul li::before {
content: '\f0da';
font-family: 'Font Awesome 5 Free';
font-weight: 900;
position: absolute;
top: 50%;
left: .9rem;
right: auto;
bottom: auto;
transform: translateY(-50%);
color:rgb(24,172,246);
}
.footer_nav ul li a,
.footer_nav ul li a:visited{
color:#fff;
}
.footer_nav ul li a:hover{color:#ccc;}

/*フッター インフォメーション*/

.footer_info{
width:90%;
font-weight:normal !important;
}
.footer_info .Box_1{
width: 100%;
font-size:1.6rem;
margin-bottom:1.2rem;
}
.footer_info .Box_2{
width: 100%;
font-size:1.2rem;
line-height:1.4;
}
.footer_info .copyRight{
font-size:1.0rem;
margin-top:.9rem;
font-family:Myriad Pro, "游ゴシック", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, sans-serif;
}

/* ================================================================================ */

/*	RETURN PAGE TOP	*/

/* ================================================================================ */
#pagetop_Block {
width:100%;
position:fixed;
right:30px;
bottom:60px;
z-index:1000;
text-align:center;
width:72px;
height:72px;
}
#pagetop{
margin:0 auto;
text-align:center;
}
#pagetop span{
font-size:9px;
padding-right:0px;
vertical-align:middle;
}
#pagetop a{
float:right;
line-height:72px;
display:block;
margin:0;
width:72px;
font-family: FontAwesome;
font-size:1.6rem;
color: #666;
text-align: center;
text-decoration: none;
background-color:rgba(200,200,200,0.6);
box-sizing:border-box;
border-radius:36px;
-webkit-transition: 1s;
-moz-transition: 1s;
-o-transition: 1s;
transition: 1s;
text-shadow: 0 0 6px rgba(255,255,255,0.8);
opacity:0.7;
-moz-opacity:0.7;
}
#pagetop a:hover {
color: #999;
}


}
