@charset "utf-8";

/*
 html5doctor.com Reset Stylesheet v1.6.1
 Last Updated: 2010-09-17 Author: Richard Clark - http://richclarkdesign.com http://html5doctor.com/html-5-reset-stylesheet/ Twitter: @rich_clark
*/
html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent;}body{line-height:1;}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block;}nav ul{list-style:none;}blockquote,q{quotes:none;}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none;}a{margin:0;padding:0;font-size:100%;vertical-align:baseline;background:transparent;}ins{background-color:#ff9;color:#000;text-decoration:none;}mark{background-color:#ff9;color:#000;font-style:italic;font-weight:bold;}del{text-decoration:line-through;}abbr[title],dfn[title]{border-bottom:1px dotted;cursor:help;}table{border-collapse:collapse;border-spacing:0;}hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:1em 0;padding:0;}input,select{vertical-align:middle;}


/* --------------------------------------------------
	01 - Basic Setting
-------------------------------------------------- */
/*	ベース設定
-------------------------------------------------- */
*,
*:before,
*:after {
	box-sizing: border-box;
}

html {
	font-size: 62.5%;
	//overflow-y: scroll;
}

body {
	position: relative;
	background-color: #fff;
	color: #333;
	font-family: YuGothic, "游ゴシック体", "Yu Gothic", "游ゴシック", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Verdana", "Helvetica", sans-serif;
	text-align: center;
	line-height: 1.5;

	// Windows Chrome
	&.win-chrome {
		-webkit-text-stroke-width: .3px !important;
	}
}

li {
	list-style: none;
}

img {
	display: block;
	width: 100%;
	max-width: 76.8rem;
	height: auto;
	margin: 0 auto;
	vertical-align: bottom;
}


/* リンク設定
-------------------------------------------------- */
a {
	color: #333;
	text-decoration: none;
}

a:link {
}

a:visited {
}

a:focus {
}

a:hover {
}

a:active {
}

a:hover > img {
}


/*	汎用クラス
-------------------------------------------------- */
.cf {
	
}

.cf:after {
	content: "";
	display: block;
	clear: both;
}

.inner {
	width: 100%;
	max-width: 64.0rem
	margin: 0 auto;
}

@media screen and (max-width:640px) {
	
	.container,
	.inner {
		padding: 0 4.0rem;
	}

}

.inner:after,
.container:after {
	content: "";
	display: block;
	clear: both;
}

.fl {
	float: left;
}

.fr {
	float: right;
}

.al {
	text-align: left !important;
}

.ac {
	text-align: center !important;
}
 
.ar {
	text-align: right !important;
}


/*---------------------------------------------------
	.l-page - ページコンテナ
-------------------------------------------------- */
.l-page {
	position: relative;
	min-height: 100%;
	z-index: 1;	
}

.l-page.is-fixed {
	position: fixed;
	width: 100%;
	height: 100%;
}



/*---------------------------------------------------
	.l-header - ヘッダー
-------------------------------------------------- */
.l-header {
	display: flex;
	justify-content: center;
	align-items: center;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 9999;
	width: 100%;
	height: 6.4rem;
	background-color: #a6165f;
	text-align: center;
}

@media screen and (orientation: landscape) {
	
	.l-header {
		padding: constant(safe-area-inset-right); 
		padding: constant(safe-area-inset-left);
	}

}

.l-header__logo img {
	position: absolute;
	top: 10px;	
	left: 16px;
	width: auto;
	height: 3.6rem;
}
	
.l-header__siteID img {
	width: auto;
	height: 2.8rem;
}

.l-header__menu-btn {
	position: absolute;
	top: 0;	
	right: 0;	
}

.l-header__menu-btn > a {
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
	width: 6.4rem;
	height: 6.4rem;
}

.l-header__menu-btn .bar {
	display: block;
	width: 26px;
	height: 0.2rem;
	margin-bottom: 0.6rem;
	background-color: #fff;
	transition: all 0.3s ease;	
}


.l-header__menu-btn.is-active  .first {
	transform: translate(0,0.8rem) rotate(405deg);
}

.l-header__menu-btn.is-active .second {
	transform: translate(0,0) rotate(-405deg);
}

.l-header__menu-btn.is-active .third {
	transform: translate(0,-0.8rem) rotate(405deg);
}

/* ナビゲーションメニュー */
.l-header__nav-menu {
	display: block;
	position: fixed;
	top: 64px;
	left: 0;
	overflow-y: scroll;
	width: 100%;
	height: 0;
}

.l-header__nav-menu.is-open {
	height: calc(100vh - 64px);
	padding: 2.0rem;
	background-color: #eee;	
}

.l-header__nav-menu > nav {
	display: block;
	width: 100%;
	height: 0;
	background-color: #eee;
	transition: all 0.3s ease;
}

.l-header__nav-menu.is-open > nav {
	height: 43.6rem !important;
}

.l-header-nav-menu-list__item {
	border-bottom: 1px dotted #999;			
	color: #333;
	font-size: 1.4rem;
	font-weight: bold;
	line-height: 1.2;
	-moz-user-select: none;
	-webkit-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.l-header-nav-menu-list__item > a {
	transiton: all 0.2s ease-out;
	display: flex;
	align-items: center;
	height: 5.0rem;
	color: #333;
	text-decoration: none !important;
}

.l-header-nav-menu-list__item > a:hover {
	color: #999;
}
		
.l-header-nav-menu-list__item > a > span {
	position: relative;
	display: block;
	width: 100%;
}

.l-header-nav-menu-list__item > a > span:after {
	content: "";
	display: block;
	position: absolute;
	top: 50%;
	margin-top: -0.4rem;
	right: 12px;	
	width: 8px;
	height: 8px;
	border-top: 1px solid #999;
	border-right: 1px solid #999;
	transform: rotate(45deg);
}


/*---------------------------------------------------
	.l-contents - コンテンツ
-------------------------------------------------- */
.l-contents {
	padding-top: 6.4rem;
}


/*---------------------------------------------------
	.l-footer - フッター
-------------------------------------------------- */
.l-footer {
	display: flex;
	justify-content: center;
	align-items: center;
	height: 2.6rem;
	margin-top: 3.6rem;
	background-color: #a6165f;
}

@media screen and (orientation: landscape) {
	
	.l-footer {
		padding: constant(safe-area-inset-right); 
		padding: constant(safe-area-inset-left);
	}

}


/*---------------------------------------------------
	.l-copyright - コピーライト
-------------------------------------------------- */
.l-copyright {
}

.l-copyright img {
	width: 12.0rem;
	height: auto;
	vertical-align: middle;
}


/*---------------------------------------------------
	言語選択
-------------------------------------------------- */
.p-select-lang {
	padding: 0 1.6rem;
}

.p-select-lang-list__item:not(:last-child) {
	margin-bottom: 1.6rem;
}

.p-select-lang-list__item img {
	display: block;
	width: 100%;
	max-width: 48.0rem;
	margin: 0 auto;
}


/*---------------------------------------------------
	コンテンツページ
-------------------------------------------------- */
//.p-single .l-contents {
//	padding-bottom: 30.0rem;
//}

#n02,
#n03,
#n04,
#n05,
#n06,
#n07,
#n08,
#n09,
#n20,
#n11,
#n12,
#n13,
#n14,
#n15,
#n16,
#n17,
#n18,
#n19,
#n20,
#n21,
#n22,
#n23,
#n24,
#n25 {
	margin-top: -6.0rem;
	padding-top: 6.0rem;
}


/*---------------------------------------------------
	ページトップボタン
-------------------------------------------------- */
.l-pagetop {
	display: none;
	position: fixed;
	bottom: 10px;
	z-index: 9;
	right: 10px;
	width: 52px;
	height: auto;
}