@charset "shift_jis";
/* CSS Document */

body {
	background-color: #fff;
	line-height: 1.6;
	font-family: YakuHanJP_Noto,Noto Sans JP,sans-serif;
	/*font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif; sans-serif;*/
	color: #000;
	letter-spacing: 0.1em;
	}

input[type="text"], select, textarea {
	padding: 4px;
	width: 95%;
	font-size: 1.4em;
	border: 2px #000 solid;
	/*border-radius: 4px;*/
    /*-webkit-border-radius: 4px;*/
	}

	/*郵便番号の場合*/
	.zip input[type="text"] {
		width: 30%;
		}

	/*電話番号の場合*/
	.tel input[type="text"] {
		width: 22%;
		}

	/*氏名の場合*/
	.name input[type="text"] {
		width: 40%;
		margin-right: -1.0em;
		}

	/*ラジオ*/
	form div.field div.value label input[type="radio"] {
		margin: 0 5px 0 5px;
		}
	
	/*チェックボックス*/
	form div.field div.value label input[type="checkbox"] {
		margin: 0 5px 0 5px;
		}


a {
	color: rgb(33, 117, 195);
	text-decoration: none;
	cursor: pointer;
	font-weight: bold;
	}
a:visited	{color: rgb(33, 117, 195);}
a:hover		{color: rgb(71,150,224)}
a:focus		{outline: thin dotted;}

p {line-height: 1.8;}
ul {margin-left: 1em;}

li {
	list-style: outside;
	list-style-type: disc;
	padding-left: inherit;
	margin-bottom: 0.5em;
	}

strong {
	font-weight: bold;
	color: #FF0004;
	}

em {
	font-style: normal;
	font-weight: bold;
	color: #FFDD00;
	son
	}

.prefix {font-size:90%;}
.postfix {font-size:90%;}

/*ラッピング*/
div#baseframe {
	width: 100%;
	max-width: 1040px;
	box-sizing: border-box;
	background-color: transparent;
	padding-top: 0em;
	padding: 0 5px 0 5px;
	/*border-top: 4px rgb(8,96,168) solid;*/
	}

div.header {
	margin-bottom: 30px;
	}

/*ヘッダのタイトル部*/
div.header div.title {
	width: 100%;
	margin: 40px auto 20px;
	padding: 0 0 1em;
	background-size: cover;
	color: #4890c3;
	font-size: 2.5em;
	font-weight: bold;
	line-height: 1em;
	/*background: #e95383;
	background: -moz-linear-gradient(top, #e95383 0%, #ffffff 67%);
	background: -webkit-linear-gradient(top, #e95383 0%,#ffffff 67%);
	background: linear-gradient(to bottom, #e95383 0%,#ffffff 67%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e95383', endColorstr='#ffffff',GradientType=0 );*/
	}

div.header div.title span {
	font-size: 0.6em;
	}

/*メイン画像を囲うボックス*/
.main_image {
	display: block;
	padding: 0;
	}

/*メイン画像*/
div.header img {
	width: 115px;
	margin: 3px 0 0px 0;
	text-align: center;
	}

div.header div.title img {
	width: 90%;
	max-width: 600px;
	}

.copyright {
	text-align: right;
	font-size: 0.8em;
	margin-right: 1em;
	}


/*プログレスバー*/
div.navi {
	background-color: transparent;
	margin: 1em 0 3em 0;
	padding: 0;
	}

div.navi ul.navi {
	position: inherit;
	margin: 0;
	padding: 0;
	}

	div.navi li {
		list-style-type: none;
		text-align: center;
		border-radius: 2px;
		-webkit-border-radius: 2px;
		}

	/*文字のボックス*/
	div.navi ul.navi li.off, div.navi ul.navi li.on {
		border: none;
		padding: 5px;
		width: 70px;
		}

	div.navi ul.navi li.off {
		background-color:#999;
		color: #fff;
		}

	div.navi ul.navi li.on {
		background-color: #3BC5FF;
		color: #fff;
		}
	

	/*矢印のボックス*/
	div.navi ul.navi li.sep, div.navi ul.navi li.sep_on {
		width: 35px;
		height: 0px;
		margin: 0;
		padding: 33px 0 0 0;
		overflow: hidden;
		}

	/*矢印をボーダーで描画*/
	div.navi ul.navi li.sep:after , div.navi ul.navi li.sep_on:after {
		content: "";
		position: absolute;
		border: 8px solid transparent;
		border-left-color: #999;
		bottom: 30%;
		left: 40%;
		}

	div.navi ul.navi li.sep_on:after {
		border-left-color: #3BC5FF;
		}


/*上の方のテキスト*/
div.info {
	font-size: 1.2em;
	padding: 30px 60px;
	background-color: #FFF;
	/*border-radius: 4px;
    -webkit-border-radius: 4px;*/
	border: 1px solid #aaaaaa;
	color: #333;
	margin: 0 0 2em 0;
	}

/*エコバッグ画像を表示*/

	div.info.sidebyside {
		}
	
	div.info.sidebyside:after {
		display: table;
		content: "";
		clear: both;
		}
	
	div.info.sidebyside p {
		clear: both;
		text-align: center;
		padding-top: 20px;
		}
	
	div.info.sidebyside img {
		display: block;
		float:left;
		width: 40%;
		margin: 0;
	
		}
	
	div.info.sidebyside ul{
		width: 55%;
		float: right;
		margin-left: 5%;
		margin-right: 0;
		}


/*下の方のテキスト*/
div.message {
	margin: 0 0 2em 0;
	padding: 30px;
	font-size: 1.2em;
	border: 1px solid #aaa;
	background-color: #fff;
	color: #333;
	text-align: left;
	}

div.message strong {
	color: #f00;
	}




/*登録確認後のメッセージ*/
div.thanks_message {
	margin-top: 0.5em;
	margin-bottom: 0.5em;
	color: #000;
	font-size: 4em;
	font-weight: bold;
	}

/*フッター*/
div.footer {
	padding: 1em 0 0;
	background-color: #000;
	color:#999;
	text-align: center;
	position: relative;
	margin-top: 100px;letter-spacing:normal;
	}

div.footer .taitoKanaLogo {
	box-sizing: border-box;
	width: 100%;
	max-width: 1040px;
	padding: 5px 10px;
	margin: 0 auto;
	text-align: left;
	}

div.footer .taitoKanaLogo img {
	width: 169px;	
	}

div.footer p{
	border-top: 1px solid #666;
	padding: 1.5em 0;
	font-size: 0.9em;
	}

div.footer .links {
	max-width: 1040px;
	text-align: right;
	padding-right: 10px;
	margin: 0 auto 1em;
	}

div.footer .links a {
	color: #cbcbcb;
	font-weight: normal;
	}

div.footer .links a:hover {
	color: #fff;
	}

div.footer .links a:after {
	color: #999;
	content: ' | ';
	}

div.footer .links a:last-child:after {
	content: '';
	}


/*項目ごとのBOX*/
form div.field {
	/*background-color: #ffeedd;*/
	/*border-radius: 4px;*/
	/*-webkit-border-radius: 4px;*/
	border-bottom: 1px #BDBDBD solid;
	padding: 20px 10px;
	margin: 0;
	color: #000;
	}




/*謎と同意だけ*/
/*.entry form div#c_nazoword.field, */form div#c_agree.field {
	background-color: transparent;
	}

/*確認画面では同意は表示しない*/
.confirm form div#c_agree.field {
	display: none;
	}

/*項目ごとの見出し*/
form div.field div.label {
	/*background-color: rgb(8,96,168);*/
	background-color: transparent;
	border: none;
	border-radius: 2px;
    -webkit-border-radius: 2px;
	text-align: left;
	width: 40%;
	float: left;
	}

	form div#c_agree.field div.label {
		float: none;
		display: none;
		}

	/*項目ごとの見出しのテキストBOX*/
	form div.field div.label div.field_head {
		border: none;
		font-size: 1.3em;
		line-height: 1.6;
		font-weight: bold;
		color: #000;
		}

	/*同意だけ*/
	form div#c_agree.field div.label div.field_head {
		display: none;
		}
	
form div#c_agree.field span.error {
	display: block;
	text-align: center;
	}

/*パラメータ取得項目は隠す*/
form div#c_uid {
	display: none;
	}


/*エラー*/
span.error {
	display: block;
	margin-top:1em;
	margin-left: 1em;
	color: #FF0000;
	}

/*必須項目のアイコン*/
span.require {
	margin: 0;
	padding: 2px 5px;
	font-size: 12px;letter-spacing: normal;
	color:#FFFFFF;
	background: none;
	background-color: #FF0004;
	border-radius: 2px;
	-webkit-border-radius: 2px;
	text-align: center;
	vertical-align: baseline;
	line-height: 1.2;
	}


span.comment {
	font-size: 1.1em;
	color: #737373;
	display: block;
	margin: 0.5em 0 0 0.5em;
}

span.require:after {
	content: "必須";
	}

.input {
	font-size: 1.2em;
	text-align: left;
	}


/*入力BOXやメッセージを囲むボックス*/
form div.field div.value {
	/*background-color:#A7282B;*/
	width: 55%;
	float: right;
	text-align: left;
	}

/*同意だけ*/
form div#c_agree.field div.value {
	width: 100%;
	float: none;

	font-size: 1.2em;
	}

form div#c_agree.field div.value .input{
	text-align: center;
	}
form div#c_agree.field div.value .input input {
	margin-right: 0.5em;
	}

form div#c_agree.field div.value .input label{
	font-weight: bold;
	}


/*フォームボタン基本*/
form div.buttons span input, .closeButton a {
	width: 10em;
	border: 1px solid #9daca9;
	border-radius: 4px;
	box-shadow: inset 0 1px #fff;
	box-shadow: rgba(0, 0, 0, 0.2) 1px 2px 3px 0px;
	font: inherit;
	letter-spacing: inherit;
	text-indent: inherit;
	color: inherit;
	text-align: center;
	padding: 6px 0 6px 0;
	color: rgb(0,0,0);
	font-size: 1.6em;
	font-weight: bold;
	text-shadow: 1px 1px 0px #fff;
	margin-bottom: 5px;
	}

/*フォームボタン　ケース別*/
form div.buttons span.button_commit input, form div.buttons span.button_next input, form div.buttons span.button_back input, .closeButton a {
	background-image: none;
	background-color: rgb(250,250,250);
	padding: 6px 0 6px 0;
	color: rgb(0,0,0);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(1.00, #ffffff), color-stop(0.51, #d1d1d1), color-stop(0.50, #dbdbdb), color-stop(0.00, #dcdcdc));
	background: -webkit-linear-gradient(top, #dcdcdc 0%, #dbdbdb 50%, #d1d1d1 51%, #ffffff 100%);
	background: -moz-linear-gradient(top, #dcdcdc 0%, #dbdbdb 50%, #d1d1d1 51%, #ffffff 100%);
	background: -o-linear-gradient(top, #dcdcdc 0%, #dbdbdb 50%, #d1d1d1 51%, #ffffff 100%);
	background: -ms-linear-gradient(top, #dcdcdc 0%, #dbdbdb 50%, #d1d1d1 51%, #ffffff 100%);
	background: linear-gradient(top, #dcdcdc 0%, #dbdbdb 50%, #d1d1d1 51%, #ffffff 100%);
	}

form div.buttons span.button_commit input:hover, form div.buttons span.button_next input:hover, form div.buttons span.button_back input:hover, .closeButton a:hover {
	background-color: #FFED00;
	color: rgb(0,0,0);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(1.00, #ffffff), color-stop(0.51, #eeeeee), color-stop(0.50, #e0e0e0), color-stop(0.00, #eeeeee));
	background: -webkit-linear-gradient(top, #eeeeee 0%, #e0e0e0 50%, #eeeeee 51%, #ffffff 100%);
	background: -moz-linear-gradient(top, #eeeeee 0%, #e0e0e0 50%, #eeeeee 51%, #ffffff 100%);
	background: -o-linear-gradient(top, #eeeeee 0%, #e0e0e0 50%, #eeeeee 51%, #ffffff 100%);
	background: -ms-linear-gradient(top, #eeeeee 0%, #e0e0e0 50%, #eeeeee 51%, #ffffff 100%);
	background: linear-gradient(top, #eeeeee 0%, #e0e0e0 50%, #eeeeee 51%, #ffffff 100%);
	}

.closeButton a {
	display: block;
	margin: 0 auto 1em;
	}

#murikuri {
	padding: 1em 0.5em 0;
	margin: 1em 0 0;
	font-size: 1.1em;
	}

#murikuri strong {
	color: #000;
	display: block;
	text-align: center;
	font-size:1.4em;
	}

#murikuri ul {
	text-align: left;
	width: 90%;
	max-width: 600px;
	margin: 20px auto;
	padding: 0;
	}



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

.input {
	margin-left: 1em;
	}

input[type="text"], select {
	}

form div.buttons span input {
	width: 7em;
	}

div.header img {
	width: 70px;
	margin: -10px 0 0 0 0;
	text-align: center;
	}

div.header div.title {
	padding-bottom: 0.5em;
	font-size: 2em;
	}

div.info {
	margin: 0 10px 2em 10px;
	}

	div.info.sidebyside {
		}
	

	div.info.sidebyside p {
		text-align: left;
		}
	
	div.info.sidebyside img {
		float: none;
		width: 50%;
		margin: 0 auto;
		}
	
	div.info.sidebyside ul{
		width: 100%;
		float: center;
		}



form div.field div.label {
	font-size: 0.8em;
	float: none;
	width: auto;
	}

form div.field div.value {
	float: none;
	width: auto;
	}


div.thanks_message {
	font-size: 3.0em;
	}

form div.field {
}

.prefix {margin-left: 1.5em;}
.postfix {margin-left: 1.5em;}
	
div.message {
	margin: 0 10px 2em 10px;
	}
	
/*フッタ*/
div.footer {
	padding-top: 0.5em;
	}

div.footer .taitoKanaLogo {
		text-align: center;
	}

div.footer .taitoKanaLogo img {
	width: 115px;
	}

div.footer .links {
	text-align: center;
	}
	
div.footer p{
	font-size: 0.7em;
	}

}


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

input[type="text"], select {
	width: 95%;
	}

form div.field div.label {
	}

form div#c_agree.field div.value {
	font-size: 1em;
	}
	
div#baseframe {
	padding: 0px 5px 5px 5px;
	}

form div.buttons span input {
	width: 6em;
	}

div.header img {
	margin-bottom: 5px;
	}


div.header div.title {
	padding-bottom: 0.75em;
	font-size: 1.5em;
	}

div.header div.title span {
	font-size: 0.8em;
	}

div.message, div.info {
	font-size: 1em;
	padding: 20px;
	}

	div.info.sidebyside img {
		width: 80%;
		}


div.thanks_message {
	font-size: 1.8em;
	}


/*矢印のボックス*/
div.navi ul.navi li.sep, div.navi ul.navi li.sep_on {
	width: 15px;
	margin: 0;
	}

	/*矢印*/
	div.navi ul.navi li.sep:after , div.navi ul.navi li.sep_on:after {
		border: 5px solid transparent;
		border-left-color: #999;
		bottom: 40%;
		}

	div.navi ul.navi li.sep_on:after {
		border-left-color: #3BC5FF;
		}

/*フッタ*/


div.footer .links {
	font-size: 0.9em;
	}


}