@charset "shift_jis";

html {
	font-size: 62.5%;
}

body {
	color: #333;
	font: 1.4rem "メイリオ","Meiryo","ＭＳ Ｐゴシック","MS PGothic",Sans-Serif;
	line-height: 2.4rem;
	background: #e9f2f0;
	-webkit-text-size-adjust: 100%;
}

/* リンク */
a {
	color: #4743B4;
}

	a:hover {
		color: #E35E5E;
	}

	a:active, a:focus {
		outline: 0;
	}

	a img {
		filter: Alpha(opacity=100);
		-moz-opacity: 1;
	}

	a:hover img {
		filter: Alpha(opacity=40);
		-moz-opacity: 0.7;
		opacity: 0.7;
	}

/* テキスト装飾 */
.txt_b {
	font-weight: bold;
}

.txt_14 {
	font-size: 1.4rem;
}

.txt_16_b {
	font-size: 1.6rem;
	font-weight: bold;
}

.txt_red {
	color: #FF0000 !important;
	font-weight: normal !important;
}

.txt_b_red {
	font-weight: bold;
	color: #FF0000;
}

.txtLFT {
	text-align: left;
}

.txtRIT {
	text-align: right;
}

.p_top {
	padding-top: 10px;
}

.p_bttm {
	padding-bottom: 20px;
}

.mBTM_-10 {
	margin-bottom: -10px;
}

.mTOP_5 {
	margin-top: 5px;
}

.mBTM_5 {
	margin-bottom: 5px;
}

.mBTM_10 {
	margin-bottom: 10px;
}

.br {
	clear: both;
}

.br2 { /* 幅で改行 */
	display: none;
}

.dsply_NO-pc {
	display: none;
}

.dsply_NO-SP {
	display: block;
}

.center {
	text-align: center;
}


/* ヘッダ
--------------------------------*/
#header {
	border-top: #04523e solid 5px;
	background-color: #f3ece0;
	overflow: hidden;
}

* html #header {
	height: 1%;
}

	/* ロゴ */
	#header .logo {
		text-align: center;
		padding: 0;
		line-height: 0;
	}

		#header .logo a img {
			line-height: 0;
			padding: 5px 0 8px 0;
			height: 50px;
		}


/* ヘッダメニュー(トップページ)
--------------------------------*/
nav#hdr_top_menu {
	overflow: hidden;
	background: #fff;
}

ul#top_menu {
	overflow: hidden;
	margin: 0;
	background: #fff;
}

* html ul#top_menu {
	height: 1%;
}

	ul#top_menu li {
		float: right;
		text-align: left;
		border-left: 1px solid #E1E1E1;
	}

	ul#top_menu a {
		font-size: 1.3rem;
		font-family: "ヒラギノ丸ゴ ProN W2","Hiragino Maru Gothic ProN","メイリオ","Meiryo","ＭＳ Ｐゴシック","MS PGothic",Sans-Serif;
		font-weight: bold;
		display: block;
		line-height: 15px;
		padding: 5px 40px 15px 15px;
		margin-left: 1px;
		color: #333;
	}

		ul#top_menu a:hover {
			filter: Alpha(opacity=50);
			-moz-opacity: 0.5;
			opacity: 0.5;
		}

.top_menu_s {
	font-size: 0.8rem;
	font-family: Arial, Helvetica, sans-serif;
	color: #878787;
}

/* グリッド
--------------------------------*/
.gridWrapper {
	clear: both;
	padding: 20px 0;
	overflow: hidden;
}

* html .gridWrapper {
	height: 1%;
}

.grid {
	float: left;
}

/* トップ左コンテンツ */
.col_left {
	margin: 0 5px 25px;
	padding-bottom: 5px;
	background: #fff;
	border: #E2E8F0 solid 1px;
	box-shadow: 0 0 2px rgba(0,0,0,0.1);
}

	.col_left h3 {
		margin: 10px 10px 0;
		color: #42669F;
		font-size: 2.2rem;
		font-weight: bold;
	}

	.col_left img {
		margin: 15px 0 5px 0;
	}

#sub .grid h3 {
	padding-left: 5px;
	font: 2.2rem "ヒラギノ丸ゴ ProN W3","Hiragino Maru Gothic ProN","メイリオ","Meiryo","ＭＳ Ｐゴシック","MS PGothic",Sans-Serif;
}

.grid p {
	padding: 5px 10px;
}

.grid ul {
	margin: 5px 10px;
}

.grid li {
	padding: 5px 0;
}

.gridWrapper img {
	max-width: 100%;
	height: auto;
}

/* フッター内 */
#footer .grid {
	color: #fff;
	background: transparent;
}

#footer .col3 ul {
	margin: 0 0 5px 2px;
}

#footer .col3 li {
	padding: 0 10px 0 8px;
	margin-bottom: 3px;
	list-style: none;
	border-bottom: 0;
	display: inline-block;
}

.footer_col3_top {
	padding-left: 2px;
	;
}

/* メインタイトル
--------------------------------*/
#headline {
	position: relative;
	overflow: hidden;
	background: #04523e;
	padding: 18px 0;
	margin-bottom: 20px;
}

	#headline h1 {
		float: left;
		position: relative;
		color: #fff;
		font-size: 2.0rem;
		line-height: 2.0rem;
		margin-left: 10px;
		padding-left: 15px;
		border-left: #FFF solid 4px;
	}

/* フロー
--------------------------------*/
.flw {
	text-align: center;
	padding: 10px 0 25px 0;
}

ul.flw_ li {
	margin: 0 -6px 0 0;
	padding: 0;
	text-align: center;
	vertical-align: top;
	display: inline-block;
	background-image: url("../img/flw_bk.png");
	background-repeat: repeat-x;
	background-position: top 0 center;
}

	ul.flw_ li:first-child {
		background-repeat: no-repeat;
		background-position: right 0;
		background-size: 50% 15px;
	}

	ul.flw_ li:last-child {
		background-repeat: no-repeat;
		background-position: left 0;
		background-size: 50% 15px;
	}

	ul.flw_ li p {
		display: block;
		margin: 0 auto;
	}

		ul.flw_ li p:first-child {
			border-radius: 22px;
			width: 22px;
			padding: 4px 0 2px 0;
			background-color: #9C9C9C; /*#9FA0C8;*/
			font-size: 1.4rem;
			line-height: 1.4rem;
			color: #FFF;
		}

		ul.flw_ li p:nth-child(2) {
			font-size: 0.4rem !important;
			padding: 0 20px;
			color: #9C9C9C;
		}

		ul.flw_ li p.flw_no {
			font-weight: bold;
			background-color: #BB001C !important;
		}

		ul.flw_ li p.flw_txt {
			color: #BB001C !important;
			font-size: 1.2rem !important;
		}

/* コンテンツ
--------------------------------*/
section.content {
	clear: both;
	margin-bottom: 30px;
	font-size: 1.4rem;
	overflow: hidden;
}

* html section.content {
	height: 1%;
}

section.top-txt {
	clear: both;
	font-size: 1.5rem;
	padding: 15px 10px;
}

p.txt-0 {
	font-weight: bold;
	color: #04523e;
	padding-left: 0;
	background-repeat: no-repeat;
	background-position: top 2px left;
}

p.txt-1,
p.txt-2 {
	font-weight: bold;
	color: #04523e;
	padding-left: 27px;
	background-repeat: no-repeat;
	background-position: top 2px left;
}

p.txt-1 {
	background-image: url(../img/txt-1.png);
}

p.txt-2 {
	background-image: url(../img/txt-2.png);
}

/* デフォルト */
.ctn {
	padding: 25px;
	margin: 2px;
	overflow: hidden;
	position: static;
	background: #fff;
	border-radius: 3px;
	box-shadow: 0 0 3px rgba(0,0,0,0.3);
}

	.ctn h2 {
		font-size: 2.0rem;
		color: #4743B4;
		padding-bottom: 10px;
	}

.privacy {
	overflow: auto;
	font-size: 1.2rem;
	line-height: 1.9rem;
	height: 190px;
	padding: 15px 20px;
	margin-bottom: 5px;
	border: solid 1px #ccc;
	background-color: #FAFAFA;
}

	.privacy p {
		word-break: normal;
		padding: 5px 0;
		display: block;
	}

p.prvcy_ttl {
	font-size: 1.3rem;
	padding: 5px 0;
	font-weight: 600;
}

ul.list_prvcy {
	padding: 0 0 0 13px;
}

	ul.list_prvcy li {
		padding: 5px 0;
	}

	ul.list_prvcy li {
		list-style: "◎";
	}

		ul.list_prvcy li.list_maru-1 {
			list-style: "①";
		}

		ul.list_prvcy li.list_maru-2 {
			list-style: "②";
		}

		ul.list_prvcy li.list_maru-3 {
			list-style: "③";
		}

		ul.list_prvcy li.list_maru-4 {
			list-style: "④";
		}

		ul.list_prvcy li.list_prvcy_no {
			list-style: " ";
		}

		ul.list_prvcy li.list_maru-5 {
			list-style: "⑤";
		}

		ul.list_prvcy li.list_maru-6 {
			list-style: "⑥";
		}

		ul.list_prvcy li.list_maru-7 {
			list-style: "⑦";
		}

		ul.list_prvcy li.list_maru-8 {
			list-style: "⑧";
		}

		ul.list_prvcy li.list_maru-9 {
			list-style: "⑨";
		}

		ul.list_prvcy li.list_maru-10 {
			list-style: "⑩";
		}

		ul.list_prvcy li.list_maru-11 {
			list-style: "⑪";
		}

		ul.list_prvcy li.list_maru-12 {
			list-style: "⑫";
		}

		ul.list_prvcy li.list_maru-13 {
			list-style: "⑬";
		}

		ul.list_prvcy li.list_maru-14 {
			list-style: "⑭";
		}

.prvcy_check {
	clear: both;
	position: relative;
	text-align: center;
	background-color: #F6F6F6;
	border: solid 1px #F6F6F6;
	padding: 23px 25px 20px 25px;
	margin-top: 10px;
}

	.prvcy_check p {
		font-size: 1.2rem;
		text-align: left;
		padding-bottom: 15px;
	}

p.mibunsyou {
	margin-top: 20px;
}

span.data {
	border-bottom: solid 1px #000;
	color: #f00;
	font-weight: bold;
}

	span.data img {
		margin: 0 2px -4px 2px;
	}

span.data_line {
	color: #000;
}

span.data_noline {
	color: #000;
	border-bottom: 0;
	font-weight: normal;
	font-size: 1.8rem;
	padding: 5px 0 0 0;
}

	span.data_noline img {
		margin: 0 2px -2px 2px;
	}

span.data_noline_ {
	border-bottom: 0;
}


/* リスト1 */
ul.list_1 {
	list-style-type: none;
	width: 100%;
}

	ul.list_1 li {
		float: left;
		padding: 2px 20px 0 0;
		list-style-image: url(../img/list_01.png);
	}

		ul.list_1 li a {
			display: inline-block;
		}

/* リスト2 */
ul.list_2 {
	clear: both;
	list-style-type: none;
	width: 100%;
	padding-bottom: 5px;
}

	ul.list_2 li {
		float: left;
		padding: 2px 20px 8px 0;
		list-style-image: url(../img/list_02.png);
	}

		ul.list_2 li a {
			display: inline-block;
		}

/* リスト3 */
ul.list_3 {
	clear: both;
}

	ul.list_3 li {
		float: left;
		list-style-type: none;
		padding: 5px 15px;
		margin: 0 5px 5px 0;
		background-image: url(../img/btn_more.png);
		background-repeat: no-repeat;
		background-position: 5px 12px;
		background-color: #D7746F;
		border-radius: 3px;
	}

		ul.list_3 li a {
			color: #fff;
			display: block;
		}

			ul.list_3 li a:hover {
				color: #EBBAB7;
			}

/* リスト4（数字） */
ul.list_4 {
	list-style-type: decimal !important;
	padding-left: 2rem !important;
	margin: 10px 15px;
}

.alignleft {
	float: left;
	clear: left;
	margin: 3px 10px 10px 1px;
}

.alignright {
	float: right;
	clear: right;
	margin: 3px 1px 10px 10px;
}

/* リスト5（無し） */
ul.list_5 {
	width: 100%;
}

	ul.list_5 li {
		list-style-type: none;
		float: left;
		padding: 2px 20px 0 0;
	}

/* リスト6（・） */
ul.list_6 {
	padding: 0 0 0 20px;
}

	ul.list_6 li {
		list-style: "・";
		padding: 2px 0 0 0;
	}


/* フッター
--------------------------------*/
#footer {
	clear: both;
	overflow: hidden;
	padding: 20px 0;
	background: #04523e;
}

* html #footer {
	height: 1%;
}

	#footer a {
		color: #fff;
	}

		#footer a:hover {
			color: #ccc;
		}

	#footer p {
		font-size: 1.0rem;
		color: #fff;
		text-align: center;
	}



/*===============================================
  PC用
===============================================*/
@media only screen and (min-width:940px) {
	.wrapper,
	.inner {
		margin: 0 auto;
		width: 940px;
		padding: 0;
	}

	#main {
		float: right;
		width: 645px;
	}

	#subpage #sub {
		float: left;
		width: 265px;
		overflow: hidden;
	}

	/* グリッド */
	.grid {
		width: 265px;
	}

	.col2 {
		width: 470px;
	}

	.col3 {
		width: 940px; /*705px;*/
	}

	#subpage #sub .grid {
		width: 100%;
		float: none;
		padding-bottom: 30px;
	}
}


/*===============================================
  モニター幅939px以下
===============================================*/
@media only screen and (max-width:939px) {
	.wrapper,
	.inner {
		width: 100%;
	}

	#header .logo {
		padding: 0 5px;
	}

	ul.flw_ li p:nth-child(2) {
		padding: 0 5px;
	}

	.br2 {
		display: block;
	}

	.dsply_NO-pc {
		display: block !important;
	}

	.dsply_NO-SP {
		display: none !important;
	}

	ul#top_menu {
		clear: both;
		width: 100%;
	}

		ul#top_menu li {
			width: 33%;
			margin: 0;
			box-sizing: border-box;
			-webkit-box-sizing: border-box;
			-moz-box-sizing: border-box;
		}

			ul#top_menu li:nth-child(3n) {
				border-right: 0;
				width: 34%;
			}

			ul#top_menu li a {
				width: 100%;
				border-top: 0;
			}

			ul#top_menu li:nth-child(5n) a, ul#top_menu li:nth-child(6n) a {
				width: 100%;
			}

	.grid {
		width: 50%;
		margin: 2px 0;
	}

	.col2 {
		float: none;
		width: 100%;
		margin: 0 0 20px;
	}

	.grid img {
		float: left;
		margin-right: 5px;
	}

	section.content {
		padding: 0;
	}

		section.content img {
			max-width: 90%;
			height: auto;
		}

	.ctn {
		margin: 2px 0;
		border-radius: 0;
		box-shadow: 0 0 3px rgba(0,0,0,0.3);
	}

	#sub .grid {
		margin-bottom: 20px;
		width: 48%;
		margin-left: 1%;
	}

	#footer {
		padding: 0;
	}

		#footer .grid {
			float: none;
			width: 100%;
			margin-bottom: 5px;
			text-align: center;
		}
}


/*===============================================
  画面の横幅が768pxまで（iPad）
===============================================*/
@media only screen and (max-width:768px) {
	#header {
		padding-bottom: 0;
	}

	ul#top_menu {
		display: none;
	}

		ul#top_menu li {
			width: 50%;
			float: left;
			border-left: 1px solid #E1E1E1;
		}

			ul#top_menu li a {
				font-size: 1.4rem;
				line-height: 16px;
			}

			ul#top_menu li:nth-child(3n) {
				width: 50%;
			}

			ul#top_menu li:nth-child(2n), ul#top_menu li:nth-child(6n) {
				border-right: 0;
			}

	#top_menu_s {
		display: none;
	}
}




/*===============================================
  画面の横幅が640pxまで（スマホ）
===============================================*/
@media only screen and (max-width:640px) {
	#header .logo {
		padding: 0 5px;
	}

	ul.flw_ li p.flw_txt {
		font-size: 1.0rem !important;
	}

	.grid {
		width: 100%;
	}

		.grid img {
			float: none;
			margin: 20px auto 10px;
		}

	img.frame {
		border-width: 2px;
	}

	.alignleft, .alignright {
		float: none;
		display: block;
		margin: 0 auto 10px;
	}

	#sub .grid {
		margin-bottom: 20px;
		width: 98%;
	}

	#footer .grid p {
		text-align: center;
	}
}


/*===============================================
  画面の横幅が480pxまで（スマホ）
===============================================*/
@media only screen and (max-width:480px) {
	#header .logo {
		max-width: 100%;
	}

	ul.flw_ li p:first-child {
		margin: 0 5px;
	}

	ul.flw_ li p:nth-child(2) {
		display: none;
	}

	ul.flw_ li p.flw_no {
		margin: 0 auto !important;
	}

	ul.flw_ li p.flw_txt {
		display: block !important;
	}
	/*ul.flw_ li p.flw_no-no{
	margin:0 10px;
}
ul.flw_ li p.flw_txt-no{
	display:none;
}*/

	ul.list_1 li {
		float: none;
	}

	ul.list_2 li {
		float: none;
	}

	ul.list_3 li {
		float: none;
	}

	ul.list_5 li {
		float: none;
	}
}