@charset "utf-8";
/* Copyright 2018 FSFIELD All Rights Reserved. */

/* ------------------------------------------------------------

basic

------------------------------------------------------------ */
@import url(https://fonts.googleapis.com/earlyaccess/notosansjp.css);

*{font-family:Noto Sans JP, Yu Gothic, "游ゴシック", "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;}

body{
	font-size:13px;
	font-size:1.3rem;/*-13px-*/
	line-height:1.8;
	color:#FFF;
	background: #000;
	font-weight: 500;
}

/* ------------------------------------------------------------

shortcodes

------------------------------------------------------------ */

/* width
---------------------------------------------- */
.w100per{width:100% !important;}

/* clear
---------------------------------------------- */
.overflow_clear{
	overflow:hidden;
	height:100%;
}

/* text-align
---------------------------------------------- */
.align_right{text-align:right !important;}
.align_left{text-align:left !important;}
.align_center{text-align:center !important;}
.center{margin:0 auto !important;}
.left{float:left !important;}
.right{float:right !important;}

/* font
---------------------------------------------- */
.normal{font-weight:normal !important;}
.bold{font-weight:bold !important;}
.italic{font-style: italic !important;}

.f9rem{font-size: .9rem !important;}
.f11rem{font-size: 1.1rem !important;}

/* vertical-align
---------------------------------------------- */
.valign_top{vertical-align:top !important;}
.valign_middle{vertical-align:middle !important;}
.valign_btm{vertical-align:bottom !important;}

/* visibility
---------------------------------------------- */
.hidden{visibility:hidden !important;}
.visible{visibility:visible !important;}

/* display
---------------------------------------------- */
.none{display:none !important;}

/* margin
---------------------------------------------- */
.mr_none{margin-right:0px !important;}
.mr_05{margin-right:5px !important;}
.mr_10{margin-right:10px !important;}
.mr_15{margin-right:15px !important;}
.mr_20{margin-right:20px !important;}
.mr_25{margin-right:25px !important;}
.mr_30{margin-right:30px !important;}
.mr_35{margin-right:35px !important;}
.mr_40{margin-right:40px !important;}
.mr_45{margin-right:45px !important;}
.mr_50{margin-right:50px !important;}

.ml_none{margin-left:0px !important;}
.ml_05{margin-left:5px !important;}
.ml_10{margin-left:10px !important;}
.ml_15{margin-left:15px !important;}
.ml_20{margin-left:20px !important;}
.ml_25{margin-left:25px !important;}
.ml_30{margin-left:30px !important;}
.ml_35{margin-left:35px !important;}
.ml_40{margin-left:40px !important;}
.ml_45{margin-left:45px !important;}
.ml_50{margin-left:50px !important;}

.mt_none{margin-top:0px !important;}
.mt_05{margin-top:5px !important;}
.mt_10{margin-top:10px !important;}
.mt_15{margin-top:15px !important;}
.mt_20{margin-top:20px !important;}
.mt_25{margin-top:25px !important;}
.mt_30{margin-top:30px !important;}
.mt_35{margin-top:35px !important;}
.mt_40{margin-top:40px !important;}
.mt_45{margin-top:45px !important;}
.mt_50{margin-top:50px !important;}
.mt_60{margin-top:60px !important;}

.mb_none{margin-bottom:0px !important;}
.mb_05{margin-bottom:5px !important;}
.mb_10{margin-bottom:10px !important;}
.mb_15{margin-bottom:15px !important;}
.mb_20{margin-bottom:20px !important;}
.mb_25{margin-bottom:25px !important;}
.mb_30{margin-bottom:30px !important;}
.mb_35{margin-bottom:35px !important;}
.mb_40{margin-bottom:40px !important;}
.mb_45{margin-bottom:45px !important;}
.mb_50{margin-bottom:50px !important;}
.mb_55{margin-bottom:55px !important;}
.mb_60{margin-bottom:60px !important;}
.mb_65{margin-bottom:65px !important;}
.mb_70{margin-bottom:70px !important;}
.mb_75{margin-bottom:75px !important;}
.mb_80{margin-bottom:80px !important;}
.mb_85{margin-bottom:85px !important;}
.mb_90{margin-bottom:90px !important;}
.mb_95{margin-bottom:95px !important;}
.mb_100{margin-bottom:100px !important;}

/* ------------------------------------------------------------

common

------------------------------------------------------------ */

#wrap_all{overflow: hidden;}

#wrapper{padding-top: 60px;}

.wrap_type01{
	padding: 0 35px;
	margin: 0 auto 60px;
}

.wrap_type02{
	padding: 0 10px;
	margin: 0 auto 60px;
}

/* ページタイトル
---------------------------------------------- */
#pagettl{
	display:-webkit-flex;/*--safari用--*/
	display:flex;
	-webkit-justify-content:center;/*--safari用--*/
	justify-content:center;
	-webkit-align-items:center;/*--safari用--*/
	align-items:center;
	background-size:cover !important;
	width: 100%;
	height: 60.3vw;
	margin-bottom: 40px;
}

#pagettl h1 img{width:100%;}

/* 見出し
---------------------------------------------- */
.heading01{
	display:-webkit-flex;/*--safari用--*/
	display:flex;
	align-items: center;
    line-height: 1.2;
    margin-bottom: 10px;
	font-size: 1.4rem;
}

.heading01:before,
.heading01:after{
	border-top: 1px solid #FFF;
	content: "";
	flex-grow: 1;
}

.heading01:before{margin-right: 15px;}

.heading01:after{margin-left: 15px;}

/* ボタン
---------------------------------------------- */
.btn01{
	padding: 15px 10px;
	display: block;
	border: 1px solid #FFF;
	color: #FFF;
	text-align: center;
}

/* ------------------------------------------------------------

header

------------------------------------------------------------ */

#header{
	height: 60px;
	width: 100%;
	background: #000;
	position: fixed;
	text-align: center;
	padding: 10px 0 0;
	z-index: 5;
}

/* ボタン
---------------------------------------------- */
#btn_menu{
	padding: 18px;
    position:fixed;
    top: 0;
	right: 0;
	z-index: 9999;
}

/*--メニューボタン--*/
.drawer-toggle,
.drawer-toggle span{
	display: inline-block;
	transition: all .4s;
	box-sizing: border-box;
	letter-spacing:normal;
}

.drawer-toggle{
	position: relative;
	width: 30px;
    height: 25px;
	background:none;
	border:none;
	display: block;
}

.drawer-toggle span{
	position: absolute;
	left: 0;
	width: 100%;
	height: 3px;
	background-color: #FFF;
}

.drawer-toggle span:nth-of-type(1){top: 0;}
.drawer-toggle span:nth-of-type(2){top: 11px;}
.drawer-toggle span:nth-of-type(3){bottom: 0;}

/*中央のラインが消え、上下のラインでクローズボタンに*/
.drawer-toggle.active span:nth-of-type(1) {
	-webkit-transform: translateY(11px) rotate(-45deg);
	transform: translateY(11px) rotate(-45deg);
	background-color: #FFF;
}
.drawer-toggle.active span:nth-of-type(2) {
	opacity: 0;
}
.drawer-toggle.active span:nth-of-type(3) {
	-webkit-transform: translateY(-11px) rotate(45deg);
	transform: translateY(-11px) rotate(45deg);
	background-color: #FFF;
}

/* ナビ
---------------------------------------------- */
.drawer-nav{
	background-color: rgba(0, 0, 0, .8);
	overflow:hidden;
	padding: 0 35px;
}

.drawer-nav ul li{
	text-align: center;
	line-height: 1;
}

.drawer-nav ul li a{display: block;}

.drawer-menu{padding: 16vw 0 !important;}

.drawer-menu  li  a{padding: 6.5vw 0;}

.drawer-menu > li:first-child a{padding: 0 0 6.5vw 0;}

.drawer-menu li img{
	width: 24.7vw;
	height: auto;
}

.submenu{
	display:-webkit-flex;/*--safari用--*/
	display:flex;
	-webkit-flex-wrap:wrap;/*--safari用--*/
	flex-wrap:wrap;
	-webkit-flex-direction: row;/*--safari用--*/
	flex-direction: row;
}

.submenu li{width: 50%;}

.nav_sns01{
	display:-webkit-flex;/*--safari用--*/
	display:flex;
	-webkit-flex-direction: row;/*--safari用--*/
	flex-direction: row;
	padding-top: 30px;
}

.nav_sns01 li{width: calc((100vw - 70px) / 4);}

.nav_sns01 li a{padding: 0;}

.nav_sns01 li img{width: 30px;}

/* ------------------------------------------------------------

footer

------------------------------------------------------------ */

#footer{
	background: #F2F2F2;
	padding: 20px 35px;
	text-align: center;
	color: #000;
}

#f_address{
	margin-bottom: 5px;
	line-height: 1.6;
}

#f_address a{
	display: block;
	color: #000;
}

#small{
	font-size: 1.1rem;
	line-height: 1.2;
	font-weight: 400;
}

/* ページトップボタン
---------------------------------------------- */
#pagetop {
	position: fixed;
	right: 10px;
	bottom: 10px;
	z-index: 2;
}

#pagetop a{
	display: block;
	width: 35px;
	height: 35px;
	background: url(../img/btn_pagetop01.png) no-repeat 0 0;
	background-size: 35px;
}

#pagetop a span{display: none;}

.drawer-open #pagetop {display: none !important;}

/* フォントサイズ
---------------------------------------------- */
.px {
  font-size: 20px
}
.em {
  font-size: 1.5em
}

span.del {
  text-decoration-line: line-through;
  text-decoration-style: solid;
  text-decoration-color: white;
}


