@charset "utf-8";

/* ------------------------------ */
/* ▼ block 要素 ▼ */

br{
	display:block;
	content:"";
	line-height:100%;
	margin:16px 0px;
}



div,table{
	margin: 0px;
	padding: 0px;
	float: none;
	border-collapse:collapse;
}

div,h1,h2,h3,h4,h5,h6,p{
	margin: 0px;
	padding: 0px;
	float: none;
	border: none;
}

table,ul,dl{
	border-collapse:collapse;
	padding:0px;
	list-style:none;
}

.outer-100{
	width:100%;
	height:auto;
	margin:0 auto;	
}

.outer-98{
	width:98%;
	height:auto;
	margin:0 auto;	
}

.outer-96{
	width:96%;
	height:auto;
	margin:0 auto;	
}

.outer-94{
	width:94%;
	height:auto;
	margin:0 auto;	
}

.outer-92{
	width:92%;
	height:auto;
	margin:0 auto;	
}

.outer-90{
	width:90%;
	height:auto;
	margin:0 auto;	
}

.outer-85{
	width:85%;
	height:auto;
	margin:0 auto;	
}

.outer-80{
	width:80%;
	height:auto;
	margin:0 auto;	
}

.outer-75{
	width:75%;
	height:auto;
	margin:0 auto;	
}

.outer-70{
	width:70%;
	height:auto;
	margin:0 auto;	
}

.outer-65{
	width:65%;
	height:auto;
	margin:0 auto;	
}

.outer-60{
	width:60%;
	height:auto;
	margin:0 auto;	
}


.outer-55{
	width:55%;
	height:auto;
	margin:0 auto;	
}

.outer-50{
	width:50%;
	height:auto;
	margin:0 auto;	
}

.outer-45{
	width:45%;
	height:auto;
	margin:0 auto;	
}

.outer-40{
	width:40%;
	height:auto;
	margin:0 auto;	
}

.grid{
	gap:10px;
}

.grid-gap-none{
	gap:0px !important;
}

.grid-auto-fill{
	grid-template-columns: repeat(auto-fill, minmax(100px, 1fr)) !important;	
}

.grid-auto-fit{
	grid-template-columns: repeat(auto-fit, minmax(100px, 1fr)) !important;	
}

.grid1{
	display:grid;
	grid-template-columns: 1fr;
}

.grid2{
	display:grid;
	grid-template-columns: 1fr 1fr;
}

.grid3{
	display:grid;
	grid-template-columns: 1fr 1fr 1fr;
}

.grid4{
	display:grid;
	grid-template-columns: 1fr 1fr 1fr 1fr;
}

.grid5{
	display:grid;
	grid-template-columns: repeat(5, 1fr);
}

.grid6{
	display:grid;
	grid-template-columns: repeat(6, 1fr);
}

.grid7{
	display:grid;
	grid-template-columns: repeat(7, 1fr);
}

.grid8{
	display:grid;
	grid-template-columns: repeat(8, 1fr);
}

.grid9{
	display:grid;
	grid-template-columns: repeat(9, 1fr);
}

.grid10{
	display:grid;
	grid-template-columns: repeat(10, 1fr);
}

.grid .clm
{
	border-style:solid;
	padding:5px 10px;
}



.grid-gap-none .clm{
	border-style:none solid solid none;
	padding:10px;
}


/* ▼ block 要素 ▼ */
/* ------------------------------ */

/* ------------------------------ */
/* ▼ BOX 関連 ▼ */


.fl-l{
	float:left;	
}
.fl-r{
	float:right;	
}

.disp-none{
	display:none;	
}

.after-clear:after{
	content: "";
	clear: both;
	height: 0;
	display: block;
	visibility: hidden;
}


/*-----------------------------------*/
/* 角丸 */

.rounded-square{
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	border-radius:5px;
	behavior: url(../ie-css3.htc);
}


.rounded-square10{
	-moz-border-radius:10px;
	-webkit-border-radius:10px;
	border-radius:10px;
	behavior: url(../ie-css3.htc);
}

.rounded-square15{
	-moz-border-radius:15px;
	-webkit-border-radius:15px;
	border-radius:15px;
	behavior: url(../ie-css3.htc);
}

/* 角丸 */
/*-----------------------------------*/


/*-----------------------------------*/
/* 半円 */

.harf-circle-updown-50{
	width: 100px;
	height: 50px;
	border-radius: 50% / 100% 100% 0 0;
}

/* 半円 */
/*-----------------------------------*/


/*-----------------------------------*/
/* 円 */

.circle-auto{
	width:auto;	
	height:auto;
	padding:2px;	
	border-radius: 50%;
	line-height:0 !important;
}

.circle-25{
	width:50px;
	height:50px;
	border-radius: 50%;
}

.circle-30{
	width:30px;
	height:30px;
	border-radius: 50%;
}

.circle-35{
	width:35px;
	height:35px;
	border-radius: 50%;
}


.circle-50{
	width:50px;
	height:50px;
	border-radius: 50%;
}

.circle-100{
	width:100px;
	height:100px;
	border-radius: 50%;
}


.circle-150{
	width:150px;
	height:150px;
	border-radius: 50%;
}

.circle-200{
	width:200px;
	height:200px;
	border-radius: 50%;
}


/* 円 */
/*-----------------------------------*/

.btn-link{
	padding:5px 20px;
	margin:0px 5px;
	cursor:pointer;
}

.btn-link-big{
	padding:5px 50px;
	margin:0px 5px;	
	cursor:pointer;
}


.foreground{
	z-index:9999;	
}

.fixed {
    position: fixed;
}

.disp-none{
	display:none;	
}

.disp-block,
.block{
	display:block;
}

.disp-inlineblock,
.inline-block,
.inline{
	display:inline-block;
}



.msg{
	width:100%;
	height:auto;
	padding:15px 0px;
	margin:0px 0px 20px;
	text-align:center;
	background:#f74308;
	color:#fff;
}

.msg span{
	display:block;
	width:100%;
	height:auto;
	line-height:40px;
	text-align:center;
	font-weight:bold;
	color:#fff;
}



/*-----------------------------------*/
/* チャプタータイトル */

.capter-title span.text:before{
	width:100%;
	display:block;
	position:absolute;
	left:0px;
	bottom:-5px;
	content:"";
	border-bottom:#000 solid 5px;
}

.capter-title span.text:after{
	width:20%;
	display:block;
	position:absolute;
	left:0px;
	bottom:-5px;
	content:"";
	border-bottom:#FF0080 solid 5px;
}


.capter-title span.text{
	position:relative;
	display:inline-block;
	padding-bottom:5px;
}

/* チャプタータイトル */
/*-----------------------------------*/


/* margin */



.magb5{
	margin-bottom:5px !important;	
}

.magb10{
	margin-bottom:10px !important;		
}

.magb15{
	margin-bottom:15px !important;	
}

.magb20{
	margin-bottom:20px !important;	
}

.magb25{
	margin-bottom:25px !important;	
}

.magb30{
	margin-bottom:30px !important;	
}

.magb35{
	margin-bottom:35px !important;	
}

.magt5{
	margin-top:5px !important;	
}

.magt10{
	margin-top:10px !important;		
}

.magt15{
	margin-top:15px !important;	
}

.magt20{
	margin-top:20px !important;	
}

.magt25{
	margin-top:25px !important;	
}

.magt30{
	margin-top:30px !important;	
}

.magt35{
	margin-top:35px !important;	
}

.magt40{
	margin-top:40px !important;	
}

.magt45{
	margin-top:45px !important;	
}

.magt50{
	margin-top:50px !important;	
}

.magt100{
	margin-top:100px !important;	
}


/* padding */


.padb5{
	padding-bottom:5px !important;	
}

.padb10{
	padding-bottom:10px !important;		
}

.padb15{
	padding-bottom:15px;	
}

.padb20{
	padding-bottom:20px;	
}


.padt5{
	padding-top:5px !important;	
}

.padt10{
	padding-top:10px !important;	
}
.padt15{
	padding-top:15px !important;	
}
.padt20{
	padding-top:20px !important;	
}
.padt25{
	padding-top:25px !important;	
}
.padt30{
	padding-top:30px !important;	
}

.padb5{
	padding-bottom:5px !important;	
}

.padb10{
	padding-bottom:10px !important;	
}
.padb15{
	padding-bottom:15px !important;	
}
.padb20{
	padding-bottom:20px !important;	
}
.padb25{
	padding-bottom:25px !important;	
}
.padb30{
	padding-bottom:30px !important;	
}
.padb40{
	padding-bottom:40px !important;	
}
.padb50{
	padding-bottom:50px !important;	
}
.padb60{
	padding-bottom:60px !important;	
}
.padb70{
	padding-bottom:70px !important;	
}


.pad005{
	padding:0px 0px 5px;	
}


.pad0010{
	padding:0px 0px 10px;	
}

.pad0015{
	padding:0px 0px 15px;	
}

.pad0020{
	padding:0px 0px 20px;	
}


.pad5-0{
	padding:5px 0px;
}


.pad10-0{
	padding:10px 0px;
}
.pad15-0{
	
	padding:15px 0px ;
}

.pad20-0{
	padding:20px 0px ;
}

.pad30-0{
	padding:30px 0px ;
}


.pad50-0{
	padding:50px 0px ;
}

.pad150-0{
	padding:150px 0px ;
}




/* over lay */

.overlay-close-btn{
	padding:5px 10px;	
}

.overlay-outer{
	width:100%;
	height:100%;
	position:fixed;
	top:0;
	left:0;
	z-index:9999;
	background-color:rgba(0,0,0,0.7);
	overflow:auto;
}

.overlay-msg{
	position: absolute;
	top:0;
	left: 0;
	right: 0;
	margin: auto;
	background-color:rgba(0,0,0,0.7);
	padding:10px;
	width:150px;
	height:auto;
}

.overlay-inner-wrap{
	position: relative;
    border-width: 5px;
    border-style: solid none none;		
}



.overlay-inner-wrap .close-btn{
	position:absolute;
	top:0px;
	right:20px;
}

.toggle-wrap{
	width:100%;
	height:100%;
	position:fixed;
	top:0;
	left:0;
	z-index:9999;
	background-color:rgba(0,0,0,0.7);
	overflow:auto;
}

.toggle-wrap .toggle-inner{
	grid-template-columns: 80% 20% !important;
	height:100%;
	grid-gap:0px !important;
}

.toggle-wrap .clm{
	padding:0px !important;	
}

.toggle-wrap .toggle-inner .clm-close{
	height:100%;
}

.toggle-wrap .toggle-inner .clm-close .close{
	position: sticky;
	top: 0;
}

/* ▼ BOX 関連 ▼ */
/* ------------------------------ */



/* ------------------------------ */
/* ▼ color 関連 ▼ */



/* font color */

.font-c-fff,
.font-c-fff:hover,
.font-c-fff:visited,
.first-letter-c-fff:first-letter
{
	color: #fff;
}

.font-c-ccc,
.font-c-ccc:hover,
.font-c-ccc:visited,
.first-letter-c-ccc:first-letter
{
	color:#ccc;
}

.font-c-red,
.font-c-red:hover,
.font-c-red:visited,
.first-letter-c-red:first-letter
{
	color: #f74308;
}


.font-c-pink,
.font-c-pink:hover,
.font-c-pink:visited,
.first-letter-c-pink:first-letter
{
	color: #F6F;
}


.font-c-green,
.font-c-green:hover,
.font-c-green:visited,
.first-letter-c-green:first-letter
{
	color: #060;
}


.font-c-000,
.font-c-000:hover,
.font-c-000:visited,
.first-letter-c-000:first-letter
{
	color: #000;
}

.font-c-666,
.font-c-666:hover,
.font-c-666:visited,
.first-letter-c-666:first-letter
{
	color: #666;
}

.font-c-999,
.font-c-999:hover,
.font-c-999:visited,
.first-letter-c-999:first-letter
{
	color: #999;
}

.font-c-ora,
.font-c-ora:hover,
.font-c-ora:visited,
.first-letter-c-ora:first-letter
{
	color: #F60;
}

.font-c-skyblue,
.font-c-skyblue:hover,
.font-c-skyblue:visited,
.first-letter-c-skyblue:first-letter
{
	color: #0CF;
}

.font-c-blue,
.font-c-blue:hover,
.font-c-blue:visited,
.first-letter-c-blue:first-letter
{
	color: #0044CC;
}

.font-c-yea,
.font-c-yea:hover,
.font-c-yea:visited,
.first-letter-c-yea:first-letter
{
	color: #FF0;
}

.font-c-purple,
.font-c-purple:hover,
.font-c-purple:visited,
.first-letter-c-purple:first-letter
{
	color: #C3C;
}

/* font color */




.bg-fff{
	background-color:#fff;
}

.bg-000{
	background-color:#000;
}


.bg-red{
	background-color:#CC0000;
}

.bg-ora{
	background-color:#F90;
}

.bg-pink{
	background-color:#F9F;
}

.bg-green{
	background-color:#090;
}

.bg-sand{
	background-color:#C5B09C;
}

.bg-skyblue{
	background-color:#6CF;
}

.bg-blue{
	background-color:#03F;
}

.bg-darkblue{
	background-color:#006;
}

.bg-purple
{
	background-color: #C3C;
}

.bg-light-gray,
.bg-lightgray
{
	background-color:#EFEFEF;
}

.bg-ccc{
	background-color:#ccc;
}

.bg-666{
	background-color:#666;
}

.bg-999{
	background-color:#999;
}

.bg-clear-blk{
	background-color: rgba(0,0,0,0.5);	
}

.bg-clear-blk60{
	background-color: rgba(0,0,0,0.6);	
}

.bg-gra-gray{
	background:linear-gradient(#F9F9F9,#BBB );
}

.bg-main1{
	background-color:#006;
}

.bg-main2{
	background-color:#009;
		
}

.bg-main3{
	background-color:#00C;
}

.bg-main4{
	background-color:#00F;
}

.bg-main5{
	background-color:#F7F7FF;
}

/* background color */


/* border color */


.border-cmain1{
	border-color:#006;
}

.border-cmain2{
	border-color:#009;
		
}

.border-cmain3{
	border-color:#00C;
}

.border-cmain4{
	border-color:#00F;
}

.border-cmain5{
	border-color:#F7F7FF;
}

.border-cfff{
	border-color:#fff;
}

.border-c000{
	border-color:#000;
}

.border-cccc{
	border-color:#ccc;
}

.border-c999{
	border-color:#999;
}

.border-c666{
	border-color:#666;
}

.border-cred{
	border-color:#F00;
}

.border-cpink{
	border-color:#F9F;
}

.border-cora{
	border-color:#F90;
}


.border-cgreen{
	border-color:#090;
}


.border-cskyblue{
	border-color:#6CF;
}

.border-cblue{
	color: #1a0dab;	
}


.border-tow-tone-p-b{
	border-color:#F6C;
}

.border-tow-tone-p-b:before{
	border-color:#000;
}

.border-tow-tone-g-b{
	border-color:#090;
}

.border-tow-tone-g-b:before{
	border-color:#000;
}


.border-tow-tone-b-p{
	border-color:#000;
}

.border-tow-tone-b-p:before{
	border-color:#F6C;
}

.border-tow-tone-b-g{
	border-color:#000;
}

.border-tow-tone-b-g:before{
	border-color:#090;
}

/* border color */


/* ▼ color ▼ */
/* ------------------------------ */



/* ------------------------------ */
/* ▼ text ▼ */

a{
	color:#0044CC;	
}

a:visited{
	color:#609;
}


.al-c{
	text-align:center;	
}

.al-l{
	text-align:left;	
}

.al-r{
	text-align:right;	
}

.textd-none{
	text-decoration:none;
}

.textd-underline{
	text-decoration:underline;
}

.textd-uline-h:hover{
	text-decoration:underline;
}


.textd-nodata{
	text-decoration:line-through;
}


.font-size8{
	font-size:8px;	
}

.font-size10{
	font-size:10px;	
}

.font-size12{
	font-size:12px;	
}

.font-size14{
	font-size:14px;	
}

.font-size16,
.first-letter-font-size16:first-letter{
	font-size:16px;	
}

.font-size18,
.first-letter-font-size18:first-letter{
	font-size:18px;	
}

.font-size20,
.first-letter-font-size20:first-letter{
	font-size:20px;	
}

.font-size22,
.first-letter-font-size22:first-letter{
	font-size:22px;	
}

.font-size24,
.first-letter-font-size24:first-letter{
	font-size:24px;	
}

.font-size26,
.first-letter-font-size26:first-letter{
	font-size:26px;	
}

.font-size28,
.first-letter-font-size28:first-letter{
	font-size:28px;	
}

.font-size30,
.first-letter-font-size30:first-letter{
	font-size:30px;	
}

.font-size32,
.first-letter-font-size32:first-letter{
	font-size:32px;	
}

.font-size34,
.first-letter-font-size34:first-letter{
	font-size:34px;	
}

.font-size36,
.first-letter-font-size36:first-letter{
	font-size:36px;	
}

.font-size38{
	font-size:38px;	
}

.font-size40{
	font-size:40px;	
}

.font-size42{
	font-size:42px;	
}

.font-size44{
	font-size:44px;	
}

.font-size46{
	font-size:46px;	
}

.font-size48{
	font-size:48px;	
}

.font-size50{
	font-size:50px;	
}

.font-size52{
	font-size:52px;	
}

.fwnormal{
	font-weight:normal;	
}

.fwbold{
	font-weight:bold;	
}

.btn{
	cursor: pointer;
}

/* ▼ text ▼ */
/* ------------------------------ */



/* ------------------------------ */
/* ▼ border ▼ */

.border-w1{
	border-width:1px;	
}

.border-w2{
	border-width:2px;	
}

.border-w3{
	border-width:3px;	
}

.border-w4{
	border-width:4px;	
}

.border-w5{
	border-width:5px;	
}

.border-w10{
	border-width:10px;	
}

.border-s-s{
	border-style:solid;	
}


.border-s-ssns{
	border-style:solid solid none solid;	
}


.border-s-sn{
	border-style:solid none;	
}

.border-s-dn{
	border-style:dotted none;	
}

.border-s-d{
	border-style:dotted;	
}

.border-s-nns{
	border-style:none none solid;	
}

.border-s-snn{
	border-style:solid none none;	
}

.border-s-nnd{
	border-style:none none dotted;	
}


.border-tow-tone{
	position: relative;
	border-style: none none solid none;
	border-width: 3px;
}



.border-tow-tone:before{
	content: "";
	position: absolute;
	left:0;
	bottom:-3px;
	width:30%;
	height: inherit;
	border-style: none none solid none;
	border-width: 3px;
}

.no-border,
.border-none
{
	border-style:none !important;	
}


/* ▼ border ▼ */
/* ------------------------------ */


/* ------------------------------ */
/* ▼ form parts ▼ */

input[type="text"],input[type="password"],select,textarea{
	padding:5px 10px;
}

input[type=radio]{
	-webkit-appearance: radio !important;
}



.form-field{
	max-width:800px;
	height:auto;
	margin:20px auto;
	padding:0px 0px 10px;
}

.form-field div.input-field-outer{
	width:94%;
	border-bottom:1px dotted #CCC;
	padding:0px 0px 10px;
	margin:0px auto 10px;
}

.form-field .input-field-title{
	position:relative;
}

.form-field .input-field-title .close-btn{
	position:absolute;
	right:10px;
	top:10px;
	display:inline-block;
	width:auto;
	height:auto;
	padding:2px 10px;
	background:#fff;
	font-size:14px;
	margin:0px 2% 0px 0px;
	text-decoration:none;
}

.form-field div.input-field-outer .input-item-inner{
	position:relative;	
}

.form-field div.input-field-outer .input-item-inner .span-label{
	position:absolute;
	top:0px;
	left:2%;
	color:#999;
}

.form-field div.input-field-outer .input-item-inner .span-msg{
	position:absolute;
	bottom:0px;
	left:2%;
	color:#F00;
}

.form-field div.input-field-outer .input-item-inner .input-item{
	width:96%;
	height:auto;
	padding:15px 2% 15px;
}

.form-field div.input-field-outer .detail-input-outer{
	width:73%;
	height:auto;	
}

.form-field div.input-field-outer .thumb{
	width:25%;
	height:auto;	
}

.form-field div.input-field-outer .thumb img{
	width:150px;
	height:auto;
	margin:0px 0px 10px;
}

.form-field div.input-field-outer .thumb .input-file{
	display:inline-block;
	color: white;  
	background-color:#666;
	padding:2px 0px;
	border-radius:5px;
	width:100%;
	text-align:center;
}

.input-border{
	border-color:#999;	
}

.form-field div.input-field-outer .input-item-submit{
	display:inline-block;
	width:auto;
	height:auto;
	padding:10px 30px;
	background:#000;
	color:#FFF;
	font-size:16px;
	text-decoration:none;
	font-weight:bold;
}

.form-field div.input-field-outer .input-item-submit-outer{
	padding:20px 0px !important;
	
}


/* ▼ form parts ▼ */
/* ------------------------------ */








