@charset "utf-8";
/* 
*************タグの再定義*************
*/

body {
	margin: 0px;
	padding: 0px;
	font-size: 16px;
	line-height: 175%;
	font-family: "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	color: #231815;
	background: #fff;
}

a:link { text-decoration: none; color: #2A2AE4;}
a:visited { text-decoration: none; color: #2A2AE4;}
a:hover { color: #FF0066; text-decoration: none;}
a:active { color: #99CC00}

p {
	margin: 0px;
	padding: 0px;
}


/* 
*************共通パーツ*************
*/
.TAJ {
	text-align: justify;
}
.TAC {
	text-align: center;
}
.FL {
	float: left;
}
.FR {
	float: right;
}
.CB {
	clear: both;
}
.MT075 {
	margin-top: 0.75em;
}
.FS125 {
	font-size: 125%;
}
.FWB {
	font-weight: bold;
}
.FCGree {
	color: #478046;
}
.FCBlue {
	color: #3d70c5;
}
.FCGry {
	color: #434343;
}
.FCRed {
	color: #C03;
}
.bgGre {
	background: #d7e4c5;
}
.w100 {
	width: 100%;
}
.MT0 {
	margin-top: 0px;
}
.textRoundBox {
	display: block;
	margin-bottom: 0.5em;
	border: 0px solid #555;
	border-radius: 4px;
	padding: 0.25em 0.75em;
	background: #dedede;
}
/* 
*************ブロック要素*************
*/

#contentsAll {
	display: block;
	position: relative;
	width: 1024px;
	margin: 0px auto;
	padding: 0px;
	box-shadow: 0px 0px 6px rgba(0,0,0,0.35);
	line-height: 175%;
}
#contents {
	display: block;
	position: absolute;
	top: 30px;
	left: 40px;
	width: 375px;
}

#photoL {
	display: block;
	position: relative;
	width: 100%;
	height: auto;
	background: #ccc;
	overflow: hidden;
}
.honbun {
	display: block;
	font-size: 115.3846%;
	line-height: 170%;
}
.titleLead {
	font-size: 160%;
	line-height: 150%;
    font-weight: bold;
    padding-bottom: 1em;
}
.honbun .title {
	font-size: 120%;
    font-weight: bold;
    padding-bottom: 0.25em;
}
/* 
*************メニュー*************
*/
#menu {
	display: block;
	position: absolute;
	top: 0px;
	left: 0px;
	width: 250px;
	height: 1200px;
	margin: 0px 0px 0px -1200px;
	padding: 15px;
	background: rgba(255,255,255,0.75);
	box-shadow: 5px 5px 3px rgba(0,0,0,0.35);
	line-height: 125%;
	opacity: 0;
	z-index: 100;
}
#menu a:link,
#menu a:visited {
	color: #15223f;
}
#menu a:hover {
	color: #c32f33;
}
#menu p {
	margin: 0px 0px 12px 0px;
	border-left: 6px solid rgba(255,255,255,0.8);
	padding: 0.5em 0em 0.5em 0.75em;
}
#menu p span {
	font-size:75%;
}
.mojiG {
	font-size: 1.5em;
    color: #69971a;
}
.mojiS {
	font-size: 1.5em;
    color: #378fca;
}


/* 
*************メニューボタン*************
*/
#menuBT {
	display: block;
	cursor: pointer;
	color: #555;
}
#menuBT p {
	float: right;
	text-align: center;
	font-size: 11px;
	line-height: 125%;
	border: none;
}
#menuBT2 {
	display: block;
	position: absolute;
	top: 10px;
	left: 10px;
	cursor: pointer;
	text-align: center;
	font-size: 11px;
	line-height: 125%;
	color: #fff;
	z-index: 100;
}
.menuBoxBut {
	display: block;
	position: absolute;
	top: 0px;
	left: 0px;
	width: 280px;
	height: 280px;
	z-index: 200;
}
	

/* 
*************ENGLISH*************
*/
#english {
	display: block;
	position: absolute;
	top: 0px;
	right: 10px;
	border-radius: 0px 0px 6px 6px;
	padding: 0.25em 1em;
	cursor: pointer;
	text-align: center;
	font-size: 11px;
	line-height: 125%;
	color: #fff;
	font-weight: bold;
	font-size: 110%;
	background: rgba(255,255,255,0.62);
	z-index: 1000;
}


/* 
*************イラスト・マスク*************
*/
#ill {
	display: block;
	position: absolute;
	top: 22%;
	left: 50%;
	width: 10%;
	margin-left: -5%;
	z-index: 1000;
}
#ill img {
	width: 100%;
}
#mask {
	display: block;
	position: absolute;
	bottom: 0%;
	left: 50%;
	width: 0vw;
	height: 5vw;
	margin-left: -5vw;
	margin-bottom: 0px;
	z-index: 1000;
	border-style: solid;
	border-width: 5vw 5vw 5vw 5vw;
	border-color: transparent transparent #fff transparent;
}

/* 
*************タイトル*************
*/
#title {
	display: table;
	position: absolute;
	top:  45%;
	right: 0px;
	width: 100%;
	margin: 0px auto;
	text-shadow: 2px 2px 2px rgba(0,0,0,0.35);
}
#maintitle {
	color: #fff;
	font-size: 3.8vw;
	line-height: 125%;
	font-weight: bold;
	text-align: center;
	white-space: nowrap;
}
#subtitle {
	display: block;
	width: auto;
	margin: 0px auto;
	padding: 0.25em 0em;
	color: #fff;
	font-size: 1.5vw;
	line-height: 125%;
	font-weight: bold;
	font-family: serif;
	text-align: center;
	text-shadow: 2px 2px 2px rgba(0,0,0,0.35);
}

/* 
*************ボックスボタンのカテゴリータイトル*************
*/
.sentenceTitleArea {
	display: block;
	position: relative;
	width: 100%;
	margin: 0px auto;
	padding: 20px 0em 8px 0em;
	text-align: center;
	line-height: 135%;
}
.sentenceTitleArea p:nth-child(1) {
	font-size: 1.25em;
}
.sentenceTitleArea p:nth-child(2) {
	font-size: 0.8125em;
}
.sentenceTitleArea p:nth-child(3) {
	padding-top: 0.25em;
	font-size: 2em;
}
.sentenceTitleArea p:nth-child(3) span {
	font-size: 1.61em;
	font-weight: bold;
	color: #69971a;
}
.sentenceTitleArea p:nth-child(3) span2 {
	font-size: 1.61em;
	font-weight: bold;
	color: #378fca;
}
.sentenceTitleArea p:nth-child(3) span.FCB {
	color: #5b7bc4;
}


/* 
*************ボックスボタン*************
*/
/* 
**背景**
*/
.menulist {
	display: table;
	position: relative;
	width: 100%;
	margin: 0px auto;
	padding: 0px 0px 20px 0px;
	/*background: #fff;*/
}
.menulistInn {
	display: table;
	position: relative;
	width: auto;
	max-width: 1200px;
	margin: 0px auto;
	padding: 0px 0px 0px 0px;
}
@media screen and (max-width: 1215px) {
.menulistInn {
	max-width: 900px;
}
}
@media screen and (max-width: 915px) {
.menulistInn {
	max-width: 600px;
}
}
@media screen and (max-width: 615px) {
.menulistInn {
	max-width: 300px;
}
}
/* 
**ボタン**
*/
.menuBox {
	display: table;
	position: relative;
	float: left;
	width: 280px;
	height: 280px;
	margin: 20px 10px 0px 10px;
	border-radius: 10px;
	padding: 0px;
	background: #000;	
	color: #fff;
	overflow: hidden;
	cursor: pointer;
}
.menuBoxInn {
	display: table;
	position: relative;
	margin-top: -296px;
	padding: 1em;
	opacity: 0;
	line-height: 140%;
	z-index: 100;
}
.menuBoxInn p:nth-child(1) {
	font-size: 87.5%;
	text-align: center;
}
.menuBoxInn p:nth-child(2) {
	font-size: 115%;
	line-height: 135%;
	font-weight: bold;
	text-align: center;
	margin-bottom: 0.5em;
	border-bottom: 1px solid #fff;
	padding-bottom: 0.5em;
}
.menuBoxInn p:nth-child(3) {
	font-size: 81.25%;
}
.detail {
	display: block;
	margin-top: 0.5em;
	text-align: center;
	background: rgba(255,255,255,0.7);
	color: #555;
	border-radius: 6px;
	font-size: 81.25%;
}
/* 
**プランセレクション(トップ用）**
*/
.planSelect {
	display: none;
	position: absolute;
	top: 0px;
	left: 20px;
	width: auto;
	border: 3px solid rgba(255,255,255,0.5);
	border-top-color: transparent;
	border-radius: 0px 0px 100px 100px;
	padding: 0.5em 0.5em 0.5em 0.5em;
	background: rgba(105,151,26,0.5);
	color: #fff;
	font-weight: normal;
}
.planSelect p {
	text-align: center;
	line-height: 125%;
}
.planSelect p {
	font-size: 0.75em;
}
.planSelect p:nth-child(2) {
	font-size: 2em;
	font-weight: bold;
}
.planSelect2 {
	display: none;
	position: absolute;
	top: 0px;
	left: 20px;
	width: auto;
	border: 3px solid rgba(255,255,255,0.5);
	border-top-color: transparent;
	border-radius: 0px 0px 100px 100px;
	padding: 0.5em 0.5em 0.5em 0.5em;
	background: rgba(91,123,196,0.5);
	color: #fff;
	font-weight: normal;
}
.planSelect2 p {
	text-align: center;
	line-height: 125%;
}
.planSelect2 p {
	font-size: 0.75em;
}
.planSelect2 p:nth-child(2) {
	font-size: 2em;
	font-weight: bold;
}

/* 
*************動画*************
*/
.area_mov {
	display: table;
	width: 560px;
	/*height: 315px;*/
	float: left;
	margin: 0px 20px 20px 20px;
	/*border: 1px solid #f00;*/
}
.if_mov {
	width: 560px;
	height: 315px;
}
@media screen and (min-width: 915px) and (max-width: 1215px) {
.area_mov {
	width: 410px;
}
.if_mov {
	width: 410px;
	height: 230px;
}
}

.text_movTitle {
	font-family: serif;
	margin-bottom: 0.5em;
	border-bottom: 1px dotted #ccc;
	padding-bottom: 0.5em;
	color: #017b56;
}
.text_mov {
	font-size: 81.25%;
	text-align: justify;
	line-height: 175%;
}
#menulistMov {
	display: table;
	position: relative;
	width: 100%;
	margin: 0px auto;
	padding: 20px 0px 20px 0px;
	background: #d7e4c5;
}


/* 
*************フッターインフォメーション*************
*/
#footerInfo {
	display: block;
	margin: 0px;
	padding: 10px 0px 10px 0px;
	background: #243A23;
	color: #fff;
	text-align: left;
	font-size: 0.8125em;
}
#footerInfoInn {
	display: flex;
	max-width: 1200px;
	margin: 0px auto;
	padding: 0px 10px;
}
#footerInfoInn > div:nth-child(1) {
	width: 35%;
}
#footerInfoInn > div:nth-child(2) {
	width: 35%;
}
#footerInfoInn > div:nth-child(3) {
	width: 30%;
}
#footerInfoInn > div > ul {
	line-height: 140%;
}
.widthH {
	display: block;
	width: 49%;
	margin: 0px;
	padding: 0px;
}
.footInfoCateTit {
	font-size: 112.5%;
	margin-bottom: 7px;
	border-bottom: 1px solid rgba(255,255,255,0.3);
	padding-bottom: 2px;
}
#footerInfo ul {
	margin: 0px;
	padding: 7px 12px 7px 12px;
	list-style-type: none;
}
#footerInfo ul li {
	/*margin: 0px 0px 0.5em 0px;*/
	border-left: 4px solid  rgba(255,255,255,0.5);
	padding: 0.25em 0.5em 0.25em 1em;
}
#footerInfo a:link,
#footerInfo a:visited {
	color: #fff;
	color: rgba(255,255,255,0.7);
}
#footerInfo a:hover {
	color: #fff;
	color: rgba(255,255,255,1);
}
#aboutInfo {
	padding-left: 100px;
	line-height: 135%;
}
#textShien {
	display: table;
	margin: 1em 0em;
	border: 3px solid rgba(255,255,255,0.5);
	border-radius: 6px;
	padding: 0.5em 0.75em;
}


/* 
*************フッター*************
*/
#footer {
	display: block;
	margin: 0px;
	padding: 10px 0px 10px 0px;
	background: #fff;
	text-align: center;
	font-size: 0.875em;
}


/* 
*************頁トップに戻る*************
*/
#gototop2 {
	display: none;
	position: fixed;
	right: 10px;
	bottom: 5px;
	width: 60px;
	height: 60px;
	cursor: pointer;
	z-index: 9000;
}

@media screen and (max-width: 480px) {
#footerInfoInn div.FR p.FL {
	float: none;
}
#footerInfoInn div.FR div.FL {
	float: none;
	width: 100%;
}
#footerInfoInn div.FL {
	float: none;
}
#footerInfoInn div.widthH {
	width: auto;
}
#aboutInfo {
	padding-left: 0px;
}

.area_mov {
	width: 100%;
	margin: 0px 20px 20px 0px;
}
.if_mov {
	width: 100%;
}


}