@charset "utf-8";


/*=======================================================
	グーン トイレトレーニング
=======================================================*/

/* ------- cmn ------- */
.flatbase{ margin-top: 0; }
main{
	padding: 30px 35px 10px;
	font-size: 14px; /* ie8 */
	font-size: 1.4rem;
	line-height: 1.6;
}

/* ------- index ------- */
#training_index_header{
	margin: 0;
	padding: 15px 40px 20px 30px;
	background-color: #f3a0a4;
	min-height: 360px;
	font-size: 15.5px; /* ie8 */
	font-size: 1.55rem;
	position: relative;
}
#training_index_header h1{
	margin: 40px 0 25px 0;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
	background: url(../img/ttl.png) no-repeat 10px top;
	width: 600px;
	height: 146px;
}
#training_index_header:after{
	content: '';
	width: 298px;
	height: 358px;
	background: url(../img/ttl_bg.png) no-repeat left top;
	display: block;
	position: absolute;
	top: 18px;
	right: 15px;
}
#training_index_header p{
	padding: 0 15px;
	width: 530px;
}

#doctor{
	padding: 20px 43px 30px;
	background: url(../img/doctor_bg.jpg) repeat left top;
	position: relative;
	line-height: 1.4;
	font-size: 13px; /* ie8 */
	font-size: 1.3rem;
}
#doctor_cont{
	margin-top: -45px;
	padding: 15px 30px 15px 280px;
	background-color: #fff;
	color: #584e4a;
}
#doctor h2{
	position: absolute;
	top: -20px;
	left: 50px;
}
#name {
	margin-bottom: 7px;
	padding-bottom: 7px;
	border-bottom: 1px solid #d6e5e5;
}
#name h3{
	font-size: 17px; /* ie8 */
	font-size: 1.7rem;
}
#name h3 span{ font-size: 0.8em; }
#director_photo{
	float: left;
	margin: 3px 0 0 -260px;
}
#doctor_cont dl{ margin-top: 7px; }
#doctor_cont dt{
	margin: 0 -70px 5px 0;
	padding: 2px 2px 2px 4px;
	width: 75px;
	float: left;
	background-color: #fbe2e3;
	border-left: 3px solid #f4afb2;
	line-height: 1.4;
	font-size: 12px; /* ie8 */
	font-size: 1.2rem;
}
#doctor_cont dd{
	margin-bottom: 5px;
	padding: 2px 10px 2px 90px;
	line-height: 1.4;
	font-size: 12px; /* ie8 */
	font-size: 1.2rem;
}
#clinic_info{
	padding: 10px;
	border: 1px solid #d6e5e5;
}

#training_index_nav{
	margin: 0 0 20px;
	padding: 30px 0 10px;
	background: url(../img/nav_bg.png) repeat left top;
	text-align: center;
}
#training_index_nav li {
	margin: 0 0 15px;
	display: inline-block;
	vertical-align: top;
	position: relative;
}
#training_index_nav li a{
	width: 286px;
	height: 143px;
	display: block;
	background-position: center top;
	background-repeat: no-repeat;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
}
#training_index_nav li a:before{
	content: ' ';
	display: block;
	background: url(../img/nav_mark.png) no-repeat center top;
	background-size: 18px 18px;
	height: 18px;
	width: 18px;
	position: absolute;
	left: 50%;
	top: -4px;
	z-index: 10;
}
#training_index_nav li a:hover{
	opacity: 0.8; /*通常*/
	-ms-filter: "alpha(opacity=80)"; /*IE8*/
}

/*li#index_nav_tr01{ padding-left: 30px;}
li#index_nav_tr02{ padding-right: 30px;}*/
li#index_nav_tr01 a{ background-image: url(../img/nav1.png); }
li#index_nav_tr02 a{ background-image: url(../img/nav2.png); }
li#index_nav_tr03 a{ background-image: url(../img/nav3.png); }
li#index_nav_tr04 a{ background-image: url(../img/nav4.png); }
li#index_nav_tr05 a{ background-image: url(../img/nav5.png); }
li#index_nav_tr06 a{ background-image: url(../img/nav6.png); }
/*#training_index_nav li#index_nav_tr01 a:before{	left: 53%; }
#training_index_nav li#index_nav_tr02 a:before{	left: 45%; }*/

#goonmom{
	margin: 15px 0 20px;
	vertical-align: middle;
}
#goonmom_logo{
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
	display: inline-block;
	background: url(../img/goonmom.png) no-repeat center center;
	background-size: 250px auto;
	width: 260px;
	vertical-align: middle;
	line-height: 26px;
}
#goonmom_btn{ margin: 10px 0 0; }
#goonmom_btn a{
	padding: 5px 18px 5px 20px;
	background-color: #fff;
	border-radius: 15px;
	border: 1px solid #eaeaea;
	display: inline-block;
	color: #717171;
}
#goonmom_btn a:hover{
	text-decoration: none;
	opacity: 0.75; /*通常*/
	-ms-filter: "alpha(opacity=75)"; /*IE8*/
}


/* ------- bottom ------- */
/* bottom cmn */
#main_cont{ margin: 0 0 20px; }
.training_section{
	padding: 0 0 10px;
	overflow: hidden;
}
.training_section p{ margin: 0 0 10px; }
.training_section p.training_img {
	margin: 0 auto;
	text-align: center;
}
.training_img { width: 320px; }
.training_img_s { width: 150px; }
.training_img img,
.training_img_s img{ margin: 15px  0 15px; }

.group{
	padding-bottom: 15px;
	width: 565px;
	float: left;
}

.training_section section{ margin-top: 20px; }
.training_section > section:first-child{ margin-top: 0; }

/* 下部ナビ */
#training_nav{
	margin-top: 20px;
	padding: 0 0 5px;
}
#training_nav_list{
	/*margin: 10px -5px 10px 0;*/
	margin: 10px -8px 10px 0;
	overflow: hidden;
}
#training_nav_list li{
	/*margin-right: 5px;
	/*width: 145px;*/
	margin: 0 8px 10px 0;
	width: 219px;
	display: block;
	float: left;
	box-sizing: border-box;
	/*border-right: 1px solid #fff;
	border-bottom: 1px solid #fff;*/
}
#training_nav_list li a{
	display: block;
	/*height: 117px;*/
	height: 58px;
	text-decoration: none;
	text-indent: 130%;
	white-space: nowrap;
	overflow: hidden;
	/*background-image: url(../img/training_nav.jpg);*/
	background-repeat: no-repeat;
}
#nav_tr_top a{
	background-image: url("../img/nav_tr_top.jpg");
}
#nav_tr_01 a{
	background-image: url("../img/nav_tr_01.jpg");
}
#nav_tr_02 a{
	background-image: url("../img/nav_tr_02.jpg");
}
#nav_tr_03 a{
	background-image: url("../img/nav_tr_03.jpg");
}
#nav_tr_04 a{
	background-image: url("../img/nav_tr_04.jpg");
}
#nav_tr_05 a{
	background-image: url("../img/nav_tr_05.jpg");
}
#nav_tr_06 a{
	background-image: url("../img/nav_tr_06.jpg");
}

#nav_tr_top a,
#nav_tr_01 a,
#nav_tr_02 a,
#nav_tr_03 a,
#nav_tr_04 a,
#nav_tr_05 a,
#nav_tr_06 a{
	background-position: 0 0;
}

#nav_tr_top.current a,
#nav_tr_01.current a,
#nav_tr_02.current a,
#nav_tr_03.current a,
#nav_tr_04.current a,
#nav_tr_05.current a,
#nav_tr_06.current a{
	background-position: 0 bottom;
}

#training_nav_list li a:hover{
	opacity: 0.7; /*通常*/
	-ms-filter: "alpha(opacity=70)"; /*IE8*/
}

/* 体験談 */
.ex_cont {
	margin: 20px 0 0;
	padding: 10px 30px 10px;
	background: url(../img/ex_cont_bg.png) repeat left top;
	background-size: 4px 4px;
}
.ex_cont { text-align: center; }
.ex_cont h2{
	margin: -5px auto 10px;
	width: 120px;
}
.ex_cont h2 img{
	width: 100%;
	height: auto;
}
.ex_list li{
	margin: 5px 5px 15px;
	padding: 25px;
	background-color: #fff;
	border-radius: 15px;
	border: 8px solid #fdf2f3;
	text-align: left;
	position: relative;
}
.comment{
	margin-bottom: 10px;
	font-size: 14px; /* ie8 */
	font-size: 1.4rem;
}
.comment span{
	margin: 5px 0;
	display: block;
}
.name{ text-align: right; }

/* 見出し */
#training_header{
	margin-bottom: 30px;
	text-align: center;
	background: url(../img/nav_bg.png) repeat left top;
	position: relative;
}
.top_back{
	position: absolute;
	top: 10px;
	left: 15px;
}
.top_back a:hover{
	opacity: 0.8; /*通常*/
	-ms-filter: "alpha(opacity=80)"; /*IE8*/
}
.content_ttl{
	margin-bottom: 3px;
	padding: 18px;
	font-size: 16px; /* ie8 */
	font-size: 1.6rem;
	background-color: #f2a0a4;
	color: #fff;
}
.content_ttl img{
	width: 454px;
	height: auto;
}
.btm_ttl{
	margin: 0 0 0 -20px;
	padding: 0.95em 0 0 110px;
	font-size: 23px; /* ie8 */
	font-size: 2.3rem;
	display: inline-block;
	line-height: 1.4;
	color: #625b59;
	background-repeat: no-repeat;
	background-position: left top;
	min-height: 113px;
	vertical-align: middle;
	box-sizing: border-box;
}

#t01 .btm_ttl{ background-image: url(../img/tr01_ttl.png);}
#t02 .btm_ttl{ background-image: url(../img/tr02_ttl.png); }
#t03 .btm_ttl{ background-image: url(../img/tr03_ttl.png); }
#t04 .btm_ttl{ background-image: url(../img/tr04_ttl.png); padding-top: 1.6em; }
#t05 .btm_ttl{ background-image: url(../img/tr05_ttl.png); }
#t06 .btm_ttl{ background-image: url(../img/tr06_ttl.png); }

.training_section h2{
	margin: 0 0 10px;
	padding: 0 0 3px 22px;
	font-size: 18px; /* ie8 */
	font-size: 1.8rem;
	border-bottom: 2px dotted #ccc;
	background: url(../img/nav_mark.png) no-repeat left center;
	background-size: 18px auto;
	vertical-align: top;
}

.training_section h3{
	margin: 15px 0 5px;
	font-size: 16px; /* ie8 */
	font-size: 1.6rem;
	color: #ec6d74;
}


/* 01 */
#t01 .btm_ttl{ margin: 10px 0 0 -45px; }
.t01_1_img{ width: 456px; }
.t01_2_img{
	float: right;
	width: 315px;
}
#ex1{
	width: 340px;
	float: left;
}
#ex2{
	width: 340px;
	float: right;
}
#training_pickup{
	margin: 35px 0;
	padding: 0 0 25px;
	background: url(../img/item_bg.jpg) repeat left top;
}
#item_list{
	margin: 10px -15px 0 15px;
	overflow: hidden;
}
#training_pickup h2{
	margin: 0 0 10px;
	padding-top: 15px;
	vertical-align: middle;
	text-align: center;
	font-size: 17px; /* ie8 */
	font-size: 1.7rem;
	color: #625b59;
	background: url(../img/item_ttl_bg.jpg) repeat-x left top;
}
#training_pickup h2 img{ vertical-align: middle; }
#item_list li{
	margin: 0 15px 0 0;
	padding: 20px;
	background-color: #fff;
	width: 380px;
	float: left;
	color: #4d4d4d;
	display: flex;
}
#item_list li a:hover{ text-decoration: none; }
#item_list li h4{
	margin: 0 0 5px;
	padding: 0 0 5px;
	font-size: 14px; /* ie8 */
	font-size: 1.4rem;
	text-align: center;
	border-bottom: 2px dotted #ddd;
	line-height: 1.3;
	color: #ec6d74;
}
.item_img{ margin-right: 10px;}
.item_info{
	/*width: 250px;
	float: right;*/
}
.item_btn { text-align: center; }
.item_btn a{
	margin: 5px 0 0;
	padding: 10px 35px 10px 25px;
	background: #ec6d74 url(../img/btn_arrow.png) no-repeat 88% center;
	display: inline-block;
	font-weight: bold;
	color: #fff;
	border-radius: 10px;
}
.item_btn a:hover {
	text-decoration: none;
	opacity: 0.8; /*通常*/
	-ms-filter: "alpha(opacity=80)"; /*IE8*/
}
.column3_wrap{ overflow: hidden; }
.column3_wrap > .column{
	margin: 0 4.5% 0 0;
	width: 30%;
	float: left;
}
.column3_wrap > .column:last-child{ margin: 0; }
.column h3{
	margin: 0 0 10px;
	text-align: center;
}

/* 02 */
#t02 .btm_ttl{ margin: 10px 0 0 -30px; }
.t02_1_img{
	float: right;
}
#t02 .training_section h2{
	padding-top: 5px;
	vertical-align: bottom;
}
.watchword{
	padding-top: 3px;
	display: inline-block;
	background: url(../img/t02.png) no-repeat center 0;
	width: 28px;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
	vertical-align: bottom;
	height: 29px;
}

/* 03 */
#t03 .btm_ttl{ margin: 10px 0 0 -40px; }
#sec3_g1{ width: 490px; }
.t03_1_img{
	float: right;
	width: 378px;
}
#sec3_g2{
	clear: both;
	float: right;
	width: 680px;
}
.t03_2_img{
	float: left;
	width: 160px;
}

/* 04 */
#t04 .btm_ttl{ margin: 10px 0 0 -35px; }
.t04_1_img{ width: 440px; }

/* 05 */
#t05 .btm_ttl{ margin: 10px 0 0 -30px; }
#sec5_g1{
	clear: both;
	float: right;
}
.t05_1_img{
	float: left;
	width: 240px;
}
.t05_2_img{ width: 505px; }
.t05_2_img img{ margin-top: 0; }

/* 06 */
#t06 .btm_ttl{ margin: 10px 0 0 -30px; }

.t06_1_img,
.t06_2_img,
.t06_3_img,
.t06_4_img,
.t06_5_img{
	text-align: center;
}

.t06_1_img img{
	width: 271px;
	height: auto;
	margin: 0 10px 0 0;
}
.t06_2_img img{
	width: 200px;
	height: auto;
	margin: 0 1em;
}
.t06_3_img img{
	width: 230px;
	height: auto;
	margin: 0 1em;
}
.t06_4_img img{
	width: 320px;
	height: auto;
}
.t06_5_img img{
	width: 135px;
	height: auto;
}

/* ===========================================
	MediaQueries
=========================================== */

/* スマホ----------------------------- */
@media screen and (max-width: 767px) {

/* ------- cmn ------- */
	main{
		margin-bottom: 40px;
		padding: 0;
		font-size: 1.3rem;
	}

/* ------- index ------- */
	#training_index_header{
		margin: 0;
		padding: 15px 0 35px;
		width: 100%;
		min-height: 0;
	}
	#training_index_header h1{
		margin: 0 auto 10px;
		text-indent: 100%;
		white-space: nowrap;
		overflow: hidden;
		background: url(../img/s/ttl.png) no-repeat center top;
		background-size: 296px auto;
		width: 296px;
		height: 156px;
	}
	#training_index_header:after{
		content: none;
	}
	#training_index_header p{
		width: auto;
		font-size: 1.35rem;
	}
	#training_index_nav{
		margin: 0;
		padding: 20px 15px 10px;
		width: 100%;
		-moz-box-sizing: border-box; /* Firefox */
		box-sizing: border-box;
		background: url(../img/nav_bg.png) repeat left top;
		background-size: 12px 12px;
	}
	#training_index_nav ul{ margin-bottom: -5px; }
	#training_index_nav li{
		margin: 0 0 10px;
		position: relative;
		width: 100%;
	}

	#training_index_nav li a{
		padding: 5px 0;
		display: block;
		border: 2px solid #f9cfd1;
		border-radius: 10px;
		background-color: #fff;
		background-position: 40% center;
		background-repeat: no-repeat;
		background-size: 230px 70px;
		text-align: center;
		overflow: hidden;
		vertical-align: middle;
		text-indent: 120%;
		white-space: nowrap;
		height: 70px;
		width: 100%;
	}
	#training_index_nav li:after{
		content: ' ';
		display: block;
		position: absolute;
		right: 6%;
		top: 35px;
		height: 15px;
		width: 15px;
		vertical-align: middle;
		background: url(../img/nav_arrow.png) no-repeat right center;
		background-size: 12px 12px;
	}
	li#index_nav_tr01{ padding-left: 0;}
	li#index_nav_tr02{ padding-right: 0;}
	li#index_nav_tr01 a{ background-image: url(../img/s/nav1.png) ; }
	li#index_nav_tr02 a{ background-image: url(../img/s/nav2.png) ; }
	li#index_nav_tr03 a{ background-image: url(../img/s/nav3.png) ; }
	li#index_nav_tr04 a{ background-image: url(../img/s/nav4.png) ; }
	li#index_nav_tr05 a{ background-image: url(../img/s/nav5.png) ; }
	li#index_nav_tr06 a{ background-image: url(../img/s/nav6.png) ; }
	#training_index_nav li#index_nav_tr01 a:before{	left: 50%; }
	#training_index_nav li#index_nav_tr02 a:before{	left: 50%; }
	#doctor{ padding: 20px; }
	#doctor_cont{
		margin-top: -35px;
		padding: 15px 15px;
	}
	#director_photo{
		float: none;
		margin: 0 0 10px;
		text-align: center;
	}
	#doctor h2{
		position: absolute;
		top: -20px;
		left: 20px;
	}
	#doctor_cont dt{
		float: none;
		width: 100%;
	}
	#doctor_cont dd{ padding: 0 0 5px; }
	#goonmom_logo{
		background: url(../img/s/goonmom.png) no-repeat center center;
		background-size: 190px auto;
		width: 200px;
		vertical-align: middle;
		line-height: 20px;
	}

	/* -- bottom -- */
	.training_section{ padding: 0 15px 10px; }
	.training_img{
		float: none;
		text-align: center;
		width: 80%;
		max-width: 300px;
	}
	.training_img img{
		margin: 0 0 10px;
		width: 100%;
		height: auto;
	}
	.group{ width: auto; }
	
	/* 体験談 */
	.ex_cont {
		padding: 10px 5px 10px;
	}
	.experiences_cont { padding: 15px; }
	.ex_list li{
		margin: 5px 5px 10px;
		padding: 15px;
	}
	.ex_cont h2{ width: 100px; }
	
	/* 見出し */
	#training_header{
		margin-bottom: 15px;
	}
	.top_back{
		position: absolute;
		top: 7px;
		left: 15px;
		width: 54px;
		height: auto;
	}
	.content_ttl{
		margin: 0;
		padding: 10px 13px 11px 75px;
	}
	.content_ttl img{
		margin: -2px 5px 0 0;
		width: 190px;
		height: auto;
	}
	.btm_ttl{
		margin: 0 10px 0 10px;
		padding: 1.4em 0 1.4em 75px;
		font-size: 1.8rem;
		display: inline-block;
		line-height: 1.2;
		background-repeat: no-repeat;
		background-position: left center;
		background-size:70px auto; 
		min-height: 90px;
	}
	.training_section h2{
		background-position: left 5px;
	}

	#t03 .btm_ttl,
	#t04 .btm_ttl,
	#t05 .btm_ttl{ padding: 2.2em 0 1.4em 73px; }

	/* 下部ナビ */
	#training_nav{
		margin-top: 20px;
		padding: 0 0 10px;
	}
	#training_nav_list{
		margin: 5px 2px;
		overflow: hidden;
		/*background-color: #fadbdc;*/
	}
	#training_nav_list li{
		margin: 0;
		width: 50%;
		display: block;
		float: left;
		-moz-box-sizing: border-box; /* Firefox */
		box-sizing: border-box;
		border-right: 1px solid #fff;
	border-bottom: 1px solid #fff;
	}
	#training_nav_list li a{
		padding:8px 0;
		display: block;
		text-indent: 0;
		white-space: normal;
		overflow: visible;
		background-image: none;
		height: 60px;
		background-color: #fadbdc;
		text-align: center;
		font-weight: bold;
		font-size: 1.15rem;
		line-height: 1.3;
		color: #666;
		text-decoration: none;
		-moz-box-sizing: border-box; /* Firefox */
		box-sizing: border-box;
	}
	#training_nav_list li:nth-child(even){ border-right: none; }
	#training_nav_list li.current a{
		background-color: #ec6d74;
		color: #fff;
	}
	#training_nav_list #nav_tr_02 a{ padding: 15px 0 0; }
	#training_nav_list #nav_tr_03 a{ padding: 15px 0 0; }
	#training_nav_list #nav_tr_04 a{ padding: 15px 0 0; }
	#training_nav_list #nav_tr_06 a{ padding: 15px 0 0; }



	/* 01 */
	#t01 .btm_ttl{ margin: 0 10px 0 5px; }
	.t01_1_img{
		margin: 10px 0 0;
		width: 80%;
	}
	#ex1,#ex2{
		width: auto;
		float: none;
	}
	#item_list h2 img{ vertical-align: middle; }
	#item_list{	margin: 10px 10px 0 10px; }
	#item_list li{
		margin: 0 0 10px 0;
		width: auto;
		display: block;
	}
	.item_img{
		margin: 0;
		text-align: center;
	}
	.item_btn { text-align: center; }
	.item_btn a{
		margin: 10px 0 0;
		padding: 10px 25px 10px 15px;
		background-color: #ec6d74;
		display: inline-block;
		font-weight: bold;
		color: #fff;
	}
	.item_btn a:hover { text-decoration: none; }

	.column3_wrap > .column{
		margin: 0 0 10px;
		width: 100%;
	}
	.column h3{
		margin: 0 0 10px;
		text-align: left;
	}
	
	/* 02 */
	#t02 .btm_ttl{ margin: 0 10px 0 10px; }

	/* 03 */

	
	/* 05 */
	#t05 .btm_ttl{ margin: 0 10px 0 5px; }
	.t05_1_img{ width: 200px; }
	.t05_2_img{ width: 270px; }
	
	/* 06 */
	.t06_1_img,
.t06_2_img,
.t06_3_img,
.t06_4_img,
.t06_5_img{
	float: none;
}
	
}