/* oshiete_anessa
----------------------------------------------------------- */
/*.main {*/
/*	padding: 0 50px 50px;*/
/*	background-color: #FFF25F;}*/
/*	@media only screen and (max-width: 750px) {*/
/*		.main {*/
/*			padding: 0 5px 5px;	} }*/

#tplHeader #headerContents {
	border-bottom: none; }
.main .topBox {
	margin: 0 -50px;
	padding: 23px 20px 14px;
	text-align: center;
	border-bottom: 1px solid #009FD6;
	background-color: #FFEA04; }
	.main .topBox a {
		display: inline-block;
		-webkit-transition: all .4s;
		-moz-transition: all .4s;
		transition: all .4s;
		text-decoration: none; }
		.main .topBox a img,
		.main .topBox a span {
			-webkit-transition: all .4s;
			-moz-transition: all .4s;
			transition: all .4s;}
		.main .topBox a:hover img {
			opacity: 0.7;}
		.main .topBox a:hover span {
			opacity: 0.6;}
		.main .topBox span {
			margin-top: 10px;
			display: block;
			color: #009fd6;
			font-size: 25px;
			font-size: 2.5rem;
			font-weight: bold;
			text-align: center;
			letter-spacing: 3px;
			white-space: pre-wrap; }
		.main .topBox img {
			width: 193px;
			margin: 0 auto;	}
			@media only screen and (max-width: 750px) {
				.main .topBox {
					margin: 0 -5px;
					padding: 13px 10px 9px;}
					.main .topBox span {
						font-size: 17px;
						font-size: 1.7rem; }
					.main .topBox img {
						width: 127px; } }

.main .comNaviUl {
	text-align: center;}
	.main .comNaviUl li {
		padding: 0 23px;
		position: relative;
		display: inline;}
	.main .comNaviUl li:before {
		margin-top: -8px;
		width: 1px;
		height: 16px;
		position: absolute;
		left: 0;
		top: 50%;
		background-color: #009FD6;
		content: "";}
	.main .comNaviUl li:first-child:before {
		display: none;}
		.main .comNaviUl li a {
			padding: 19px 0;
			position: relative;
			display: inline-block;
			color: #009fd6;
			font-size: 16px;
			font-size: 1.6rem;
			letter-spacing: 1px;
			line-height: 1.1;
			-webkit-transition: all .4s;
			-moz-transition: all .4s;
			transition: all .4s;}
		.main .comNaviUl li a:after {
			width: 100%;
			height: 3px;
			position: absolute;
			left: 0;
			top: 0;
			background-color: #009FD6;
			opacity: 0;
			-webkit-transition: all .4s;
			-moz-transition: all .4s;
			transition: all .4s;
			content: "";}
		.main .comNaviUl li a:hover {
			text-decoration: none;}
			.main .comNaviUl li a:hover:after,
			.main .comNaviUl li.on a:after {
				opacity: 1;}
		@media only screen and (max-width: 750px) {
			.main .mainBox {
				padding: 10px 5px;}
				.main .comNaviUl li {
					display: inline-block;
					padding: 0 6px;}
				.main .comNaviUl li:first-child {
					display: none;}
				.main .comNaviUl li:nth-child(2) {
					padding-left: 0;}
				.main .comNaviUl li:nth-child(2):before {
					display: none;}
					.main .comNaviUl li:before {
						margin-top: -7px;
						height: 14px;}
					.main .comNaviUl li a:hover:after {
						display: none;}
					.main .comNaviUl li.on a:after {
						display: block;}
					.main .comNaviUl li a {
						white-space: pre-wrap;
						padding: 15px 0;
						font-size: 13px;
						font-size: 1.3rem;
						letter-spacing: 0; } }

.main .comWhiteBox {
	margin: 0 auto;
	max-width: 1100px;
	min-width: 880px;
	padding: 50px;
	box-shadow: 2px 2px #E7DA56;
	background-color: #FFF;}
	@media only screen and (max-width: 750px) {
		.main .comWhiteBox {
			padding: 10px 10px 20px;
			width: auto;
			box-shadow: none;
			min-width: inherit;	} }

.main .headLine {
	margin-bottom: 21px;
	color: #FFEA04;
	font-size: 15px;
	font-size: 1.5rem;
	font-weight: bold;
	line-height: 1.5; }
	.main .headLine a {
		margin-bottom: 9px;
		display: block;
		color: #FFF;
		font-size: 26px;
		font-size: 2.6rem;
		letter-spacing: 3px;
		-webkit-transition: all .4s;
		-moz-transition: all .4s;
		transition: all .4s; }
	.main .headLine a:hover {
		text-decoration: none;
		cursor: pointer; }
	@media only screen and (max-width: 750px) {
		.main .headLine {
			margin-bottom: 11px;
			font-size: 12px;
			font-size: 1.2rem;
			line-height: 1.3; }
			.main .headLine a {
				margin-bottom: 7px;
				font-size: 19px;
				font-size: 1.9rem; } }

.main .more {
	margin-top: 40px; }
	.main .more a {
		padding: 10px;
		display: block;
		font-size: 14px;
		font-size: 1.4rem;
		font-weight: bold;
		color: #009fd6;
		text-align: center;
		background-color: #f0f0f0;
		-webkit-transition: all .4s;
		-moz-transition: all .4s;
		transition: all .4s;}
	.main .more a:hover {
		opacity: 0.6;
		text-decoration: none; }
		.main .more span {
			padding-right: 30px;
			display: inline-block;
			white-space: pre-wrap;
			background: url(/common/img/oshiete_anessa/icon02.gif) no-repeat right center; }
	@media only screen and (max-width: 750px) {
		.main .more {
			margin-top: -2px !important;
			position: relative;
			z-index: 1; }
			.main .more a {
				padding: 7px 10px;
				font-size: 14px;
				font-size: 1.4rem;
				opacity: 1 !important; }
				.main .more span {
					padding-right: 15px;
					white-space:nowrap;
					background: url(/common/img/oshiete_anessa/icon02.gif) no-repeat right center;
					background-size: auto 5px; } }

.main .topInner {
	margin: -45px -45px 36px;
	padding: 10px 10px 11px;
	display: table;
	background-color: #38B4DF; }
	.main .topInner .photoBox {
		background-color: #FFF;
		width: 56%;
		display: table-cell; }
		.main .topInner .photoBox img {
			width: 600px;
			height: auto; }

			@media only screen and (max-width: 750px) {
				.main .topInner .photoBox img {
					width: 100%;
					height: auto; }
			}
	.main .topInner .textBox {
		padding-left: 40px;
		display: table-cell;
		vertical-align: middle;	}
	.main .topInner .textBox .headLine a:hover {
		opacity: 0.6;
		text-decoration: none; }
		.main .topInner .textBox .comTag a {
			padding: 5px 10px 3px 28px; }
		@media only screen and (max-width: 750px) {
		.main .topInner {
			margin: -5px -5px 10px;
			padding: 5px 5px 12px;
			display: block; }
			.main .topInner .photoBox {
				width: 100% !important;
				margin-bottom: 12px;
				display: block;	}
			.main .topInner .textBox {
				padding: 0 0 0 10px; }
				.main .topInner .textBox .comTag a {
					padding: 3px 7px 1px 18px;
					font-size: 14px;
					font-size: 1.4rem;
					background-size: 10px auto;	} }

.main .topInner01 {
	margin: 0 0 40px;
	padding: 0;
	background-color: #FFF; }
	.main .topInner01 .photoBox {
		width: 52%;
		border: 10px solid #fff587;	}
	.main .topInner01 .textBox {
		padding-left: 50px;	}
	.main .topInner01 .headLine a {
		color: #009fd6;	}

	@media only screen and (max-width: 750px) {
		.main .topInner01 {
			margin-bottom: 8px;
			padding: 0;	}
			.main .topInner01 .photoBox {
				margin-bottom: 8px;
				border-width: 5px;	}
			.main .topInner01 .textBox {
				padding: 0;	} }
/* keyword */
#keyword {
	overflow: hidden;
	zoom: 1; }
	#keyword .comList01 > li {
		width: 48%;}
	#keyword .comList01 > li:nth-child(2n) {
		float: right; }
	#keyword .comList01 > li:nth-child(2) {
		border-top: 1px dotted #4bbbe2;	}
	#keyword .more {
		display: none; }

	@media only screen and (max-width: 750px) {
		#keyword {
			margin-bottom: 12px; }
			#keyword .comList01 {
				width: 100%;
				float: none !important; }
		#keyword .more {
			margin: 15px 0 0 !important;
			display: block; }
			#keyword .comList01 > li:nth-child(2) {
				border-top: none;	} }

	@media only screen and (min-width: 751px) {
		#keyword .comList01 > li {
			display: block !important; }
		#keyword .more {
			display: none !important; } }

.main .h1Ttl {
	margin: 0 8px 20px;
	padding-left: 35px;
	color: #009fd6;
	font-size: 28px;
	font-size: 2.8rem;
	font-weight: bold;
	background: url(/common/img/oshiete_anessa/keyword/h2_bg.gif) no-repeat left 6px;  }
	.main .h1Ttl span {
		margin-left: 15px;
		display: inline-block;
		font-size: 18px;
		font-size: 1.8rem;
		font-weight: normal; }
	@media only screen and (max-width: 750px) {
		.main .h1Ttl {
			margin: 4px 4px 10px;
			padding-left: 20px;
			font-size: 2px;
			font-size: 2rem;
			background-size: 16px 15px; }
		.main .h1Ttl span {
			white-space: pre-wrap;
			font-size: 14px;
			font-size: 1.4rem; } }

#listArea {
	margin-bottom: 50px; }
@media only screen and (max-width: 750px) {
	#listArea {
		margin-bottom: 0;
		border-bottom: 1px dotted #009fd6; } }

#content {
	overflow: hidden; }
	#content #leftArea {
		width: 63%;
		float: left; }
	#leftArea .comList01 > li p {
		margin-bottom: 13px; }
		#leftArea .comList01 > li p a {
			margin-bottom: 10px;
			font-size: 16px;
			font-size: 1.6rem; }
	#leftArea .more {
		margin-top: 20px;
		clear: both; }

	@media only screen and (max-width: 750px) {
		#content {
			margin: 0; }
			#content #leftArea {
				margin: 0 0 25px;
				width: auto;
				float: none; }
			#leftArea .comList01 {
				margin-top: 0; }
				#leftArea .comList01 > li {
					padding: 10px 0;
					border-top: none; }
				#leftArea .comList01 > li p {
					margin-bottom: 10px; }
					#leftArea .comList01 > li p a {
						margin-bottom: 5px;
						font-size: 12px;
						font-size: 1.2rem; }
			#leftArea .more {
				margin-top: 20px;
				clear: both; } }

#side {
	float: right;
	width: 31%; }
	@media only screen and (max-width: 750px) {
		#side {
			width: auto;
			float: none; } }

#keyTab .comTag a {
	line-height: 1.7; }
	@media only screen and (max-width: 750px) {
		#keyTab .comTag  {
			margin-top: 5px; }
			#keyTab .comTag li {
				margin-top: 5px; } }

/* detail
----------------------------------------------------------- */
#detail .comWhiteBox {
	min-width: 980px;
	overflow: hidden;
	zoom: 1;
	position: relative; }
	#detail h1 {
		margin: 0 0 18px;
		color: #2d6aa6;
		font-size: 32px;
		font-size: 3.2rem;
		letter-spacing: 3px;
		text-align: center; }
	/*#detail #content {*/
	/*	float: left;*/
	/*	width: 640px; }*/

		@media (min-width: 751px) and (max-width: 1200px) {
			#detail.main {
				padding: 0 0 50px; }
			#detail.main .topBox {
				margin: 0; }
			#detail .comWhiteBox {
				padding: 50px 40px;}
			#detail #content {
				width: 62.2%; } }
		@media only screen and (max-width: 750px) {
			#detail .comWhiteBox {
				min-width: inherit; }
				#detail h1 {
					margin: 0;
					padding: 7px 0 6px;
					letter-spacing: 1px;
					font-size: 20px;
					font-size: 2rem; }
				#detail #content {
					float: none;
					width: auto; } }
#detail #side {
	float: right;
	width: 310px; }
	@media only screen and (max-width: 750px) {
		#detail #side {
			float: none;
			width: auto; } }
	@media (min-width: 751px) and (max-width: 1200px) {
		#detail #side {
			width: 33.3%; } }

#detail #content .comTag {
	margin-bottom: 35px;
	text-align: center;}
	#detail #content .comTag li {
		float: none;
		display: inline-block;
		margin: 10px 5px 0; }
		@media only screen and (max-width: 750px) {
			#detail #content .comTag {
				margin-bottom: 20px; } }

#detail .horizonImg,
#detail .mainImg {
	margin-bottom: 38px;
	border: 26px solid #afdeed; }
	@media only screen and (max-width: 750px) {
		#detail .horizonImg,
		#detail .mainImg  {
		margin-bottom: 15px;
		border-width: 13px; }
			#detail .horizonImg img ,
			#detail .mainImg img {
				width: 100%;
				height: auto; } }
	@media (min-width: 751px) and (max-width: 1200px) {
		#detail .horizonImg {
			margin-bottom: 30px; }
		#detail .horizonImg img {
			width: 100%;
			height: auto; } }

#detail #content p {
	margin-bottom: 32px;
	font-size: 16px;
	font-size: 1.6rem;
	line-height: 2; }
	#detail #content p sup {
		margin: 0 3px;
		font-size: 12px;
		font-size: 1.2rem;
		vertical-align: middle;}
	#detail #content p a {
		font-weight: bold;
		color: #009fd6;
		-webkit-transition: all .4s;
		-moz-transition: all .4s;
		transition: all .4s;
		text-decoration: underline; }
		#detail #content p a:hover {
			opacity: 0.6; }
			@media only screen and (max-width: 750px) {
				#detail #content p {
					margin-bottom: 20px;
					font-size: 15px;
					font-size: 1.5rem;
					line-height: 1.54; }
					#detail #content p sup {
						font-size: 11px;
						font-size: 1.1rem; } }

#detail .headingTtl {
	padding: 33px 20px 14px 113px;
	position: relative;
	font-size: 18px;
	font-size: 1.8rem;
	line-height: 1.7;
	color: #2d6aa6;
	font-weight: bold;
	letter-spacing: 1px; }
	#detail .headingTtl p {
		font-size: 2rem !important;
		margin-bottom: 0; }


	#detail .headingTtl span {
		font-size: 12px;
		font-size: 1.2rem;
		vertical-align: top;}
	#detail .headingTtl:after {
		width: 100%;
		height: 2px;
		content: "";
		position: absolute;
		left: 0;
		top: 9px;
		background: url(/common/img/oshiete_anessa/detail/line.gif) repeat-x left top; }
	#detail .headingTtl:before {
		margin-top: -26px;
		width: 100px;
		height: 52px;
		content: "";
		position: absolute;
		left: 0;
		top: 50%;
		background: url(/common/img/oshiete_anessa/detail/img01.gif) no-repeat left top; }
		@media only screen and (max-width: 750px) {
			#detail .headingTtl {
				padding: 61px 10px 16px;
				font-size: 16px;
				font-size: 1.6rem;
				line-height: 1.5;
				font-weight: bold;
				text-align: center; }
				#detail .headingTtl span {
					font-size: 16px;
					font-size: 1.6rem;}
				#detail .headingTtl:after {
					top: 1px; }
				#detail .headingTtl:before {
					margin: 0 0 0 -36px;
					width: 72px;
					height: 52px;
					left: 50%;
					top: 10px;
					background-size: 72px auto; } }
					@media all and (-ms-high-contrast:none){
						#detail .headingTtl {
							letter-spacing: 0; } }



#detail .link {
	margin: -6px 0 36px; }
	#detail .link a {
		padding-right: 20px;
		font-size: 16px;
		font-size: 1.6rem;
		font-weight: bold;
		color: #009fd6;
		display: inline-block;
		background: url(/common/img/oshiete_anessa/detail/icon01.png) no-repeat right center;
		-webkit-transition: all .4s;
		-moz-transition: all .4s;
		transition: all .4s;}
		#detail .link a:hover {
			text-decoration: none;
			opacity: 0.6;	}
		@media only screen and (max-width: 750px) {
				#detail .link {
					margin: -6px 0 16px; }
					#detail .link a {
						padding-right: 10px;
						font-size: 15px;
						font-size: 1.5rem;
						display: inline;
						background-size: 5px auto; }}



#detail .h3Ttl {
	margin-bottom: 15px;
	padding: 4px 5px 3px;
	color: #FFF;
	font-size: 18px;
	font-size: 1.8rem;
	font-weight: bold;
	text-align: center;
	background-color: #38b4df;
	letter-spacing: 2px; }
	@media only screen and (max-width: 750px) {
		#detail .h3Ttl {
			margin-bottom: 10px;
			padding: 5px;
			font-size: 16px;
			font-size: 1.6rem; } }

#detail .infoList {
	margin-bottom: 30px;
	overflow: hidden; }
	#detail .infoList li {
		width: 50%;
		float: left;}
		#detail .infoList a {
			display: table;
			width: 100%;
			text-decoration: none; }
			#detail .infoList span {
				display: table-cell;
				vertical-align: middle;
				-webkit-transition: all .4s;
				-moz-transition: all .4s;
				transition: all .4s;  }
			#detail .infoList .photo {
				width: 106px; }
			#detail .infoList .photo img {
				border: 2px solid #fff587; }
			#detail .infoList a:hover .photo {
				opacity: 0.7; }
			#detail .infoList .txt {
				padding: 0 15px;
				color: #009fd6;
				font-size: 13px;
				font-size: 1.3rem;
				font-weight: bold;
				text-decoration: none;
				text-align: left; }
			#detail .infoList a:hover .txt {
				opacity: 0.6; }
	@media only screen and (max-width: 750px) {
		#detail .infoList {
			margin-bottom: 20px; }
		#detail .infoList li {
			width: 100%; }
		#detail .infoList .photo {
			width: 76px;}
			#detail .infoList .photo img {
				width: 76px;
				height: auto; }
			#detail .infoList .txt {
				font-size: 15px;
				font-size: 1.5rem; } }

#detail #content .comList01 {
	margin: -10px 0 30px; }
	#detail #content .comList01 > li {
		padding: 10px 0; }
	#detail #content .comList01 > li:first-child {
		border-top: 0; }
		#detail #content .comList01 .photo {
			margin: 0 15px 0 0;
			border-width: 2px; }
		#detail #content .comList01 span {
			font-size: 11px;
			font-size: 1.1rem; }
		#detail #content .comList01 p {
			margin: 0 0 0 120px; }
		#detail #content .comList01 p a {
			margin-bottom: -9px;
			padding-top: 11px;
			font-size: 13px;
			font-size: 1.3rem;
			color: #009fd6;
			text-decoration: none; }
	@media only screen and (max-width: 750px) {
		#detail #content .comList01 {
			margin-bottom: 25px; }
			#detail #content .comList01 p {
				margin-left: 30% !important; }
				#detail #content .comList01 p a {
					margin-bottom: -5px;
					padding-top: 5px;
					font-size: 13px;
					font-size: 1.3rem; }
			#detail #content .comList01 .photo {
				margin-right: 10px;
				width: 27.5%; } }

#detail .contact {
	width: 640px;
	padding: 22px 10px 25px;
	clear: both;
	text-align: center;
	background-color: #e5f5fb; }
	#detail .contact p {
		margin-bottom: 13px;
		font-size: 14px;
		font-size: 1.4rem; }
	#detail .contact li {
		margin: 0 8px;
		display: inline; }
		#detail .contact li a {
			-webkit-transition: all .4s;
			-moz-transition: all .4s;
			transition: all .4s;}
		#detail .contact li a:hover {
			filter: alpha(opacity=70);
			opacity: 0.7; }
		@media only screen and (max-width: 750px) {
			#detail .contact {
				margin-top: 25px;
				width: auto;
				padding: 17px 5px; }
				#detail .contact p {
					margin-bottom: 12px;
					font-size: 12px;
					font-size: 1.2rem; }
				#detail .contact li {
					margin: 0 4px; }
					#detail .contact li a img {
						width: 126px;
						height: auto; }
					#detail .contact li a:hover {
						filter: alpha(opacity=100);
						opacity: 1; } }

		@media (min-width: 751px) and (max-width: 1200px) {
			#detail .contact {
				width: 62.2%; } }

#detail #content .notes {
	margin-bottom: 41px; }
	#detail #content .notes li {
		font-size: 12px;
		font-size: 1.2rem;
		text-indent: -3.5em;
		padding: 0 0 5px 3.5em; }

	@media only screen and (max-width: 750px) {
		#detail #content .notes {
			margin-bottom: 22px;
			font-size: 12px;
			font-size: 1.2rem; } }

#detail .imgRightBox {
	overflow: hidden;}
	#detail .imgRightBox .photo {
		margin: 10px 0 25px 15px;
		float: right;}
		#detail .imgRightBox .photo img {
			width: 240px;
			border: 13px solid #AFDEED;}
			@media (min-width: 0) and (max-width: 750px) {
				#detail .imgRightBox .photo {
					margin: 0 auto 20px;
					width: 55%;
					float: none;}
					#detail .imgRightBox .photo img {
						width: 100%;
						border-width: 6px;} }

#detail .imgLeftBox {
	overflow: hidden;}
	#detail .imgLeftBox .photo {
	margin: 10px 30px 30px 0;
		float: left;}
		#detail .imgLeftBox .photo img {
			width: 240px;
			border: 13px solid #AFDEED;}
			@media (min-width: 0) and (max-width: 750px) {
				#detail .imgLeftBox .photo {
					margin: 0 auto 20px;
					width: 55%;
					float: none;}
					#detail .imgLeftBox .photo img {
						width: 100%;
						border-width: 6px;} }

.verticalImg {
	margin-bottom: 30px;}
	.verticalImg img {
		border: 13px solid #AFDEED;	}
		@media (min-width: 0) and (max-width: 750px) {
		.verticalImg {
			margin: 0 auto 20px;
			width: 55%;}
			.verticalImg img {
				width: 100%;
				border-width: 6px;} }

/* image size
------------------------- */

.main .comList .photo img {
	width: 302px;
	height: auto;
}

@media (min-width: 0) and (max-width: 750px) {
	.main .comList .photo img {
		width: 100%;
		height: auto;
	}
}

.main #content .comList .photo img,
.main #keyword .comList .photo img {
	width: 154px;
	height: auto;
}

@media (min-width: 0) and (max-width: 750px) {
	.main #content .comList .photo img,
	.main #keyword .comList .photo img {
		width: 100%;
		height: auto;
	}
}
