@charset "utf-8";

html{ height: 100%;	font-size: 62.5%; display: none;}

/*------------------------------------------------
▼body▼
------------------------------------------------*/

body {
	font-size: 1.6rem;
	line-height: 1.5;
	letter-spacing: 0.05em;
	color: #333333;
	font-family: メイリオ, Meiryo, 游ゴシック体, 'Yu Gothic', YuGothic, 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
	margin: 0;
	padding: 0;
	word-wrap : break-word;
	overflow-wrap : break-word;
	height: 100%;
	position: relative;
}

* {
margin:0;
padding:0;
}

p{ margin: 10px 0; }

pre,
code {
	font-size: 0.8em;
	line-height: 1em;
	color: #000000;
	padding: 10px;
	width: 100%;
	box-sizing: border-box;
	background-color: #eeeeee;
	display: block;
	margin-top: 10px;
	margin-bottom: 10px;
}

ul,ol{ 	margin: 0px; padding: 0px;	list-style-type: none;}

img{ border: none; }

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


/*------------------------------------------------
▼link▼
------------------------------------------------*/
a:link{
}

a:visited{
}

a:hover{
	filter: alpha(opacity=80);
	-moz-opacity: 0.80;
	opacity: 0.80;
	transition: 1.0s;
}


/*------------------------------------------------
▼width▼
------------------------------------------------*/
.w10{width: 10px!important; }
.w20{width: 20px!important; }
.w30{width: 30px!important; }
.w40{width: 40px!important; }
.w50{width: 50px!important; }
.w60{width: 60px!important; }
.w70{width: 70px!important; }
.w80{width: 80px!important; }
.w90{width: 90px!important; }
.w100{width: 100px!important; }
.w150{width: 150px!important; }
.w200{width: 200px!important; }
.w250{width: 250px!important; }
.w300{width: 300px!important; }
.w100per{width: 100%!important; }
.w50per{width: 50%!important; }

/*------------------------------------------------
▼font▼
------------------------------------------------*/
.mincho { font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif; transform: rotate(.03deg); }
.tx_size_3l{ font-size: 2.6em; }
.tx_size_ll{ font-size: 2.2em; }
.tx_size_l{ font-size: 1.8em; }
.tx_size_m{ font-size: 1.4em; }
.tx_size_s{ font-size: 0.8em; }
.tx_size_ss{ font-size: 0.6em; }

.tx_color_red{
	color: #FF0004;
}

.tx_bold{font-weight: bold;}

h1,h2,h3,h4,h5,h6{
	font-size: 1.4em;
	line-height: 1.4em;
	clear: both;
	font-weight: normal;
	box-sizing: border-box;
}


.asterisk{font-size: 0.7em; position: relative; padding: 0 0 0 15px;}
.asterisk::before{content: '※'; position: absolute; top: 0px;left: 0px;}

.asterisk_01,.asterisk_02,.asterisk_03,.asterisk_04,.asterisk_05
{font-size: 0.7em; position: relative; padding: 0 0 0 25px;}

.asterisk_01::before,.asterisk_02::before,.asterisk_03::before,.asterisk_04::before,.asterisk_05::before
{position: absolute; top: 0px;left: 0px;}

.asterisk_01::before{content: '※1';}
.asterisk_02::before{content: '※2';}
.asterisk_03::before{content: '※3';}
.asterisk_04::before{content: '※4';}
.asterisk_05::before{content: '※5';}

/*------------------------------------------------
▼align▼
------------------------------------------------*/
.aligncenter { text-align: center; }
.alignleft { text-align: left; }
.alignright { text-align: right; }
img.aligncenter { margin-left:auto;	margin-right:auto; }
img.alignleft { float: left; }
img.alignright {float: right; }

/*------------------------------------------------
▼padding▼
------------------------------------------------*/
.pd10{padding: 10px;}
.pd20{padding: 20px;}
.pd30{padding: 30px;}
.pd40{padding: 40px;}
.pd50{padding: 50px;}

.pt10{padding-top: 10px!important;}
.pt20{padding-top: 20px!important;}
.pt30{padding-top: 30px!important;}
.pt40{padding-top: 40px!important;}
.pt50{padding-top: 50px!important;}

/*------------------------------------------------
▼margin▼
------------------------------------------------*/
/*top*/
.mt0{ margin-top: 0px !important; }
.mt10{ margin-top: 10px !important; }
.mt20{ margin-top: 20px !important; }
.mt30{ margin-top: 30px !important; }
.mt40{ margin-top: 40px !important; }
.mt50{ margin-top: 50px !important; }
.mt100{ margin-top: 100px !important; }

/*bottom*/
.mb0 { margin-bottom: 0px !important; }
.mb10 { margin-bottom: 10px !important; }
.mb20 { margin-bottom: 20px !important; }
.mb30 { margin-bottom: 30px !important; }
.mb40 { margin-bottom: 40px !important; }
.mb50 { margin-bottom: 50px !important; }
.mb100 { margin-bottom: 100px !important; }

/*right*/
.mr10 { margin-right: 10px !important; }
.mr20 { margin-right: 20px !important; }
.mr30 { margin-right: 30px !important; }
.mr40 { margin-right: 40px !important; }
.mr50 { margin-right: 50px !important; }

/*left*/
.ml10 { margin-left: 10px !important; }
.ml20 { margin-left: 20px !important; }
.ml30 { margin-left: 30px !important; }
.ml40 { margin-left: 40px !important; }
.ml40 { margin-left: 50px !important; }

.m_auto { margin-left: auto; margin-right: auto; }
.border_none{ border: none!important; }

/*------------------------------------------------
▼other▼
------------------------------------------------*/
hr {
	border: 0;
	height: 0;
	border-top: 1px solid rgba(0, 0, 0, 0.1);
	border-bottom: 1px solid rgba(255, 255, 255, 0.3);
	margin-top: 30px;
	margin-bottom: 30px;
	width: 100%;
	display: block;
}

blockquote{
	border: 1px solid #EEEEEE;
	background-color: #F9F9F9;
	padding-top: 30px;
	padding-left: 45px;
	padding-right: 45px;
	padding-bottom: 30px;
}
@media screen and (max-width: 750px) {
.blockquote{ padding-top: 20px; }
}

/*------------------------------------------------
▼responsive▼
------------------------------------------------*/

.pc{ display: block; }
.sp{ display: none; }
@media screen and (max-width: 750px) {
.pc{ display: none; }
.sp{ display: block; }
}

/*------------------------------------------------
▼some input▼
------------------------------------------------*/
input[type="button"],
input[type="submit"] {
	background-color: #555555;
	border: 0px solid #555555;
	background-image: -webkit-linear-gradient(270deg,rgba(85,85,85,1.00) 0%,rgba(85,85,85,1.00) 100%);
	background-image: linear-gradient(180deg,rgba(85,85,85,1.00) 0%,rgba(85,85,85,1.00) 100%);
	padding-top: 15px;
	padding-right: 40px;
	padding-left: 40px;
	padding-bottom: 15px;
	font-size: 1.1em;
	color: #FFFFFF;
	cursor: pointer;
	display: block;
	margin-right: auto;
	margin-left: auto;
	max-width: 100%;
}

select,
textarea,
input[type="text"],
input[type="password"],
input[type="tel"] ,
input[type="email"] ,
input[type="number"] {
	padding-top: 10px;
	padding-right: 10px;
	padding-left: 10px;
	padding-bottom: 10px;
	font-family: inherit;
	font-size: 1.0em;
	border: 1px solid #CCCCCC;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	display: block;
	max-width: 100%;
	border-radius: 3px;
}

input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}
input[type="number"] {
	-moz-appearance:textfield;
}

input[type="checkbox"],
input[type="radio"]{
	margin-right: 5px;
}

input[type="button"]:hover,
input[type="submit"]:hover {
	border: 0px solid #AAAAAA;
	outline: 0;
	filter: alpha(opacity=80);
	-moz-opacity: 0.80;
	opacity: 0.80;
	transition: 1.0s;
}
textarea:hover,
input:hover {
}

select:active,
select:focus,
input:active,
input:focus,
textarea:active,
textarea:focus{
	background-color: #FFFEEE;
	outline: 0;
}

textarea::placeholder,
input::placeholder {
  color: #CCCCCC!important;
}

input[type="submit"][disabled] {
	background-color: #CCCCCC;
	cursor: default;
	background-image: -webkit-linear-gradient(270deg,rgba(204,204,204,1.00) 0%,rgba(204,204,204,1.00) 100%);
	background-image: -moz-linear-gradient(270deg,rgba(204,204,204,1.00) 0%,rgba(204,204,204,1.00) 100%);
	background-image: -o-linear-gradient(270deg,rgba(204,204,204,1.00) 0%,rgba(204,204,204,1.00) 100%);
	background-image: linear-gradient(180deg,rgba(204,204,204,1.00) 0%,rgba(204,204,204,1.00) 100%);
}

/*css radio_btn*/
.radio_btn-input{
	display: none;
}
.radio_btn-input + label{
	padding-left: 25px;
	position:relative;
	margin-right: 20px;
	cursor: pointer;
}
.radio_btn-input + label::before{
	content: "";
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 15px;
	height: 15px;
	border: 1px solid #999;
	border-radius: 50%;
	margin-right: 5px;
}
.radio_btn-input:checked + label{
	color: #E57F00;
}
.radio_btn-input:checked + label::after{
	content: "";
	display: block;
	position: absolute;
	top: 3px;
	left: 3px;
	width: 11px;
	height: 11px;
	background-color: #E57F00;
	border-radius: 50%;
}

/* css check_box */
.check_box-input{
	display: none;
}
.check_box-parts{
	padding-left: 25px;
	position:relative;
	margin-right: 20px;
	cursor: pointer;
	display: flex;
	justify-content: flex-start;
	align-items: center;
}
.check_box-parts::before{
	content: "";
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 15px;
	height: 15px;
	border: 1px solid #999;
	border-radius: 4px;
	margin-right: 5px;
}
.check_box-input:checked + .check_box-parts{
	color: #E57F00;
}
.check_box-input:checked + .check_box-parts::after{
	content: "";
	display: block;
	position: absolute;
	top: -5px;
	left: 5px;
	width: 7px;
	height: 14px;
	transform: rotate(40deg);
	border-bottom: 3px solid #E57F00;
	border-right: 3px solid #E57F00;
}

@media screen and (max-width: 750px) {
/* 
--------------------------------------------------*/
select,
textarea{
	width: 100%;
}

select,
textarea,
input[type="text"],
input[type="password"],
input[type="tel"] ,
input[type="email"] ,
input[type="number"] {
	display: block;
}

}

/*------------------------------------------------
▼layout▼
------------------------------------------------*/
/*--flex column--*/
.col_nowrap{ display: flex;	flex-wrap: nowrap; flex-direction: row; }
.col_box{ width:100%; }
.col_flow{ flex: 1; }
.col_fix100{ width:100px; }
.col_fix200{ width:200px; }
.col_fix300{ width:300px; }
.col_fix400{ width:300px; }
.col_fix500{ width:300px; }
.col_fix600{ width:300px; }

@media screen and (max-width: 750px) {
.col_nowrap{ display: flex; flex-wrap: wrap; flex-direction: row; }
.col_box,
.col_flow,
.col_fix100,
.col_fix200,
.col_fix300,
.col_fix400,
.col_fix500,
.col_fix600{
	width:100%;
}
	
}

/*--flex カラム数あり--*/
.col_wrap{ display: flex; flex-wrap: wrap; flex-direction: row;}

/*--flex 2column--*/
.col2_box,
.col2sp_box{
	width : 50% ; 
	width : calc(100% / 2) ;
}

/*--flex 3column--*/
.col3_box,
.col3sp_box{
	width : 33.33333% ;
	width : -webkit-calc(100% / 3) ;
	width : calc(100% / 3) ;
}

/*--flex 4column--*/
.col4sp_box,
.col4_box{
	width : 25% ;
	width : calc(100% / 4) ;
}

/*--flex 5column--*/
.col5_box,
.col5sp_box{
	width : 20% ;
	width : calc(100% / 5) ;
}

@media screen and (max-width: 750px) {

.col2_box,
.col3_box,
.col4_box,
.col5_box{
	width : 100% ; 
}
	
.col2sp_box,
.col4sp_box,
.col5sp_box{
	width : 50% ; 
}
	
}
/*----------------------------------------------*/
/*----------------------------------------------*/


/*--position--*/
.flex_c {
	display: flex; /* 子要素をflexboxで揃える */
	flex-direction: column; /* 子要素をflexboxにより縦方向に揃える */
	justify-content: center; /* 子要素をflexboxにより中央に配置する */
	align-items: center;  /* 子要素をflexboxにより中央に配置する */
	min-height: 0px;
}

/*--左寄せ--*/
.flex_l {
	display: flex;
	justify-content: flex-start;
	min-height: 0px;
}
/*--右寄せ--*/
.flex_r {
	display: flex;
	justify-content: flex-end;
	min-height: 0px;
}

