@charset "utf-8";
/* ==========================================================================
beloved-hokkaido.css
for/en/jp/japan-travel-planner/beloved-hokkaido/chitose_eniwa_kitahiroshima.html
========================================================================== */

/*base
----------------*/
#mainArea{
  width:100%;
}

/*container
----------------*/
#container {
	position: relative;
	padding-top: 114px;
}
#contents {
	padding-top: 0;
}
@media screen and (max-width: 949px) {
	#container {
		padding-top: 0;
	}
}

/*attractiveAreas
----------------*/
#attractiveAreas {
	padding-top: 0;
}

/*experience_contents
----------------*/
.experience_contents {
	position: relative;
	background-color: #f1f8fe;
}
.experience_contents:before,
.experience_contents:after {
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	height: 800px;
}
.experience_contents:before {
	background-repeat: no-repeat;
	background-position: 50%;
	-webkit-background-size: cover;
	background-size: cover;
}
.experience_contents:after {
	background: url(/japan-travel-planner/feature/beloved-hokkaido/images/komagatake/main_bg_bottom.png) repeat-x 50% 100%;
	z-index: 8;
}
@media (min-width: 950px), print {
	.experience_contents:before {
		background-image: url(/japan-travel-planner/feature/beloved-hokkaido/images/komagatake/main_bg.jpg);
	}
}
@media (min-width: 950px), print {
	.food_bg:before {
		background-image: url(/japan-travel-planner/feature/beloved-hokkaido/images/komagatake/main_bg_food.jpg);
	}
}
@media (min-width: 950px), print {
	.winter_bg:before {
		background-image: url(/japan-travel-planner/feature/beloved-hokkaido/images/komagatake/main_bg_winter.jpg);
	}
}
@media screen and (min-width: 1650px) {
	.experience_contents:after {
		-webkit-background-size: 100%;
		background-size: 100%;
	}
}
@media screen and (max-width: 949px) {
	.experience_contents:before,
	.experience_contents:after {
		height: 365px;
	}
	.experience_contents:before {
		background-image: url(/japan-travel-planner/feature/beloved-hokkaido/images/komagatake/main_bg_sp.jpg);
	}
	.food_bg:before {
		background-image: url(/japan-travel-planner/feature/beloved-hokkaido/images/komagatake/main_bg_sp_food.jpg);
	}
	.winter_bg:before {
		background-image: url(/japan-travel-planner/feature/beloved-hokkaido/images/komagatake/main_bg_sp_winter.jpg);
	}
	.experience_contents:after {
		-webkit-background-size: 100%;
		background-size: 100%;
	}
}
@media screen and (max-width: 448px) {
	.experience_contents:after {
		-webkit-background-size: 448px;
		background-size: 448px;
	}
}



.experience_contents.index:before {
	content: none;
}
.experience_contents .index_bg {
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	z-index: 1;
}
.experience_contents .index_bg .bg {
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	height: 800px;
	background-repeat: no-repeat;
	background-position: 50%;
	-webkit-background-size: cover;
	background-size: cover;
}
@media (min-width: 950px), print {
	.experience_contents .index_bg .bg01 {
		background-image: url(/japan-travel-planner/feature/beloved-hokkaido/images/komagatake/main_bg.jpg);
	}
	.experience_contents .index_bg .bg02 {
		background-image: url(/japan-travel-planner/feature/beloved-hokkaido/images/komagatake/main_bg_food.jpg);
	}
	.experience_contents .index_bg .bg03 {
		background-image: url(/japan-travel-planner/feature/beloved-hokkaido/images/komagatake/main_bg_winter.jpg);
	}
}
@media screen and (max-width: 949px) {
	.experience_contents .index_bg .bg {
		height: 365px;
	}
	.experience_contents .index_bg .bg01 {
		background-image: url(/japan-travel-planner/feature/beloved-hokkaido/images/komagatake/main_bg_sp.jpg);
	}
	.experience_contents .index_bg .bg02 {
		background-image: url(/japan-travel-planner/feature/beloved-hokkaido/images/komagatake/main_bg_sp_food.jpg);
	}
	.experience_contents .index_bg .bg03 {
		background-image: url(/japan-travel-planner/feature/beloved-hokkaido/images/komagatake/main_bg_sp_winter.jpg);
	}
}






@media (min-width: 950px), print {
	.experience_contents.outdoor01:before {
		background-image: url(/japan-travel-planner/feature/beloved-hokkaido/images/komagatake/outdoor/01_main.jpg);
	}
}
@media screen and (max-width: 949px) {
	.experience_contents.outdoor01:before {
		background-image: url(/japan-travel-planner/feature/beloved-hokkaido/images/komagatake/outdoor/01_main_sp.jpg);
	}
}


@media (min-width: 950px), print {
	.experience_contents.outdoor02:before {
		background-image: url(/japan-travel-planner/feature/beloved-hokkaido/images/komagatake/outdoor/02_main.jpg);
	}
}
@media screen and (max-width: 949px) {
	.experience_contents.outdoor02:before {
		background-image: url(/japan-travel-planner/feature/beloved-hokkaido/images/komagatake/outdoor/02_main_sp.jpg);
	}
}



@media (min-width: 950px), print {
	.experience_contents.outdoor03:before {
		background-image: url(/japan-travel-planner/feature/beloved-hokkaido/images/komagatake/outdoor/03_main.jpg);
	}
}
@media screen and (max-width: 949px) {
	.experience_contents.outdoor03:before {
		background-image: url(/japan-travel-planner/feature/beloved-hokkaido/images/komagatake/outdoor/03_main_sp.jpg);
	}
}



@media (min-width: 950px), print {
	.experience_contents.outdoor04:before {
		background-image: url(/japan-travel-planner/feature/beloved-hokkaido/images/komagatake/outdoor/04_main.jpg);
	}
}
@media screen and (max-width: 949px) {
	.experience_contents.outdoor04:before {
		background-image: url(/japan-travel-planner/feature/beloved-hokkaido/images/komagatake/outdoor/04_main_sp.jpg);
	}
}



@media (min-width: 950px), print {
	.experience_contents.outdoor05:before {
		background-image: url(/japan-travel-planner/feature/beloved-hokkaido/images/komagatake/outdoor/05_main.jpg);
	}
}
@media screen and (max-width: 949px) {
	.experience_contents.outdoor05:before {
		background-image: url(/japan-travel-planner/feature/beloved-hokkaido/images/komagatake/outdoor/05_main_sp.jpg);
	}
}



@media (min-width: 950px), print {
	.experience_contents.outdoor06:before {
		background-image: url(/japan-travel-planner/feature/beloved-hokkaido/images/komagatake/outdoor/06_main.jpg);
	}
}
@media screen and (max-width: 949px) {
	.experience_contents.outdoor06:before {
		background-image: url(/japan-travel-planner/feature/beloved-hokkaido/images/komagatake/outdoor/06_main_sp.jpg);
	}
}






@media (min-width: 950px), print {
	.experience_contents.food01:before {
		background-image: url(/japan-travel-planner/feature/beloved-hokkaido/images/komagatake/food/01_main.jpg);
	}
}
@media screen and (max-width: 949px) {
	.experience_contents.food01:before {
		background-image: url(/japan-travel-planner/feature/beloved-hokkaido/images/komagatake/food/01_main_sp.jpg);
	}
}


@media (min-width: 950px), print {
	.experience_contents.food02:before {
		background-image: url(/japan-travel-planner/feature/beloved-hokkaido/images/komagatake/food/02_main.jpg);
	}
}
@media screen and (max-width: 949px) {
	.experience_contents.food02:before {
		background-image: url(/japan-travel-planner/feature/beloved-hokkaido/images/komagatake/food/02_main_sp.jpg);
	}
}



@media (min-width: 950px), print {
	.experience_contents.food03:before {
		background-image: url(/japan-travel-planner/feature/beloved-hokkaido/images/komagatake/food/03_main.jpg);
	}
}
@media screen and (max-width: 949px) {
	.experience_contents.food03:before {
		background-image: url(/japan-travel-planner/feature/beloved-hokkaido/images/komagatake/food/03_main_sp.jpg);
	}
}



@media (min-width: 950px), print {
	.experience_contents.food04:before {
		background-image: url(/japan-travel-planner/feature/beloved-hokkaido/images/komagatake/food/04_main.jpg);
	}
}
@media screen and (max-width: 949px) {
	.experience_contents.food04:before {
		background-image: url(/japan-travel-planner/feature/beloved-hokkaido/images/komagatake/food/04_main_sp.jpg);
	}
}



@media (min-width: 950px), print {
	.experience_contents.food05:before {
		background-image: url(/japan-travel-planner/feature/beloved-hokkaido/images/komagatake/food/05_main.jpg);
	}
}
@media screen and (max-width: 949px) {
	.experience_contents.food05:before {
		background-image: url(/japan-travel-planner/feature/beloved-hokkaido/images/komagatake/food/05_main_sp.jpg);
	}
}



@media (min-width: 950px), print {
	.experience_contents.food06:before {
		background-image: url(/japan-travel-planner/feature/beloved-hokkaido/images/komagatake/food/06_main.jpg);
	}
}
@media screen and (max-width: 949px) {
	.experience_contents.food06:before {
		background-image: url(/japan-travel-planner/feature/beloved-hokkaido/images/komagatake/food/06_main_sp.jpg);
	}
}






@media (min-width: 950px), print {
	.experience_contents.winter01:before {
		background-image: url(/japan-travel-planner/feature/beloved-hokkaido/images/komagatake/winter/01_main.jpg);
	}
}
@media screen and (max-width: 949px) {
	.experience_contents.winter01:before {
		background-image: url(/japan-travel-planner/feature/beloved-hokkaido/images/komagatake/winter/01_main_sp.jpg);
	}
}


@media (min-width: 950px), print {
	.experience_contents.winter02:before {
		background-image: url(/japan-travel-planner/feature/beloved-hokkaido/images/komagatake/winter/02_main.jpg);
	}
}
@media screen and (max-width: 949px) {
	.experience_contents.winter02:before {
		background-image: url(/japan-travel-planner/feature/beloved-hokkaido/images/komagatake/winter/02_main_sp.jpg);
	}
}



@media (min-width: 950px), print {
	.experience_contents.winter03:before {
		background-image: url(/japan-travel-planner/feature/beloved-hokkaido/images/komagatake/winter/03_main.jpg);
	}
}
@media screen and (max-width: 949px) {
	.experience_contents.winter03:before {
		background-image: url(/japan-travel-planner/feature/beloved-hokkaido/images/komagatake/winter/03_main_sp.jpg);
	}
}



@media (min-width: 950px), print {
	.experience_contents.winter04:before {
		background-image: url(/japan-travel-planner/feature/beloved-hokkaido/images/komagatake/winter/04_main.jpg);
	}
}
@media screen and (max-width: 949px) {
	.experience_contents.winter04:before {
		background-image: url(/japan-travel-planner/feature/beloved-hokkaido/images/komagatake/winter/04_main_sp.jpg);
	}
}



@media (min-width: 950px), print {
	.experience_contents.winter05:before {
		background-image: url(/japan-travel-planner/feature/beloved-hokkaido/images/komagatake/winter/05_main.jpg);
	}
}
@media screen and (max-width: 949px) {
	.experience_contents.winter05:before {
		background-image: url(/japan-travel-planner/feature/beloved-hokkaido/images/komagatake/winter/05_main_sp.jpg);
	}
}



@media (min-width: 950px), print {
	.experience_contents.winter06:before {
		background-image: url(/japan-travel-planner/feature/beloved-hokkaido/images/komagatake/winter/06_main.jpg);
	}
}
@media screen and (max-width: 949px) {
	.experience_contents.winter06:before {
		background-image: url(/japan-travel-planner/feature/beloved-hokkaido/images/komagatake/winter/06_main_sp.jpg);
	}
}





.experience_contents .header_item {
	position: relative;
	width: 950px;
	margin: 0 auto 100px;
	height: 650px;
	padding: 50px 0 0;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	z-index: 2;
}
.experience_contents .header_item h1 {
	position: relative;
	display: inline-block;
	padding: 25px 40px 25px 25px;
	background-color: rgba(255,255,255,.7);
	font-size: 30px;
	line-height: 1.3;
	color: #234cb1;
	z-index: 3;
}
.experience_contents  .header_item h1:before {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	border-left: 5px solid rgba(35,76,177,.7);
}
@media screen and (max-width: 949px) {
	.experience_contents  .header_item {
		width: auto;
		height: 325px;
		padding: 25px 15px;
	}
	.experience_contents  .header_item h1 {
		min-width: 0;
		padding: 15px 20px 15px 15px;
		font-size: 18px;
		line-height: 1.3;
	}
	.experience_contents  .header_item h1:before {
		border-left-width: 3px;
	}
}

.experience_contents  .header_item .index_title {
	width: 470px;
	height: 450px;
	margin: 10px auto 0;
	padding-top: 160px;
	background: url(/japan-travel-planner/feature/beloved-hokkaido/images/komagatake/main_title_bg.png) no-repeat;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
.experience_contents  .header_item .index_title span {
	display: block;
	color: #fff;
	font-weight: bold;
	font-size: 54px;
	line-height: 1.3;
	text-align: center;
	font-style: italic;
	-webkit-transform: rotate(-16deg);
	-ms-transform: rotate(-16deg);
	-o-transform: rotate(-16deg);
	transform: rotate(-16deg);
}
@media screen and (max-width: 949px) {
	.experience_contents  .header_item .index_title {
		width: 235px;
		height: 225px;
		-webkit-background-size: cover;
		background-size: cover;
		margin-top: -20px;
		padding-top: 70px;
	}
	.experience_contents  .header_item .index_title span {
		font-size: 30px;
	}
}


.experience_contents.head_min:before,
.experience_contents.head_min:after {
	height: 450px;
}
html.zh-TW .experience_contents.head_min:before,
html.zh-TW .experience_contents.head_min:after {
	height: 420px;
}
html.zh-HK .experience_contents.head_min:before,
html.zh-HK .experience_contents.head_min:after {
	height: 420px;
}
.experience_contents.head_min:before {
	background-position: 50% 40%;
}
.experience_contents.head_min  .header_item {
	height: 310px;
}
.experience_contents  .header_item .cat_title {
	width: 470px;
	height: 400px;
	margin: -100px auto 0;
	padding-top: 120px;
	line-height: 120%;
	background: url(/japan-travel-planner/feature/beloved-hokkaido/images/komagatake/main_title_bg.png) no-repeat;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	font-size: 48px;
	color: #fff;
	text-align: center;
	font-weight: bold;
}
html.en .experience_contents  .header_item .cat_title {
	padding-top: 105px;
}
html.zh-TW .experience_contents  .header_item .cat_title {
	height: 360px;
}
html.zh-HK .experience_contents  .header_item .cat_title {
	height: 360px;
}
@media screen and (max-width: 949px) {
	html.zh-TW .experience_contents.head_min:before,
	html.zh-TW .experience_contents.head_min:after {
		height: 195px;
	}
	html.zh-HK .experience_contents.head_min:before,
	html.zh-HK .experience_contents.head_min:after {
		height: 195px;
	}
	html.en .experience_contents.head_min:before,
	html.en .experience_contents.head_min:after {
		height: 220px;
	}
	.experience_contents.head_min  .header_item {
		height: 150px;
	}
	.experience_contents  .header_item .cat_title {
		width: 235px;
		height: 160px;
		-webkit-background-size: 100%;
		background-size: 100%;
		margin-top: -70px;
		padding-top: 75px;
		font-size: 18px;
	}
	html.en .experience_contents  .header_item .cat_title {
		height: 190px;
		padding-top: 75px;
	}
	html.zh-TW .experience_contents .header_item .cat_title {
		height: 160px;
	}
	html.zh-HK .experience_contents .header_item .cat_title {
		height: 160px;
	}
}
@media screen and (max-width: 768px) {
	html.en .experience_contents.head_min:before,
	html.en .experience_contents.head_min:after {
		height: 210px;
	}
	html.en .experience_contents  .header_item .cat_title {
		padding-top: 85px;
	}
	html.zh-TW .experience_contents.head_min:before,
	html.zh-TW .experience_contents.head_min:after {
		height: 180px;
	}
	html.zh-HK .experience_contents.head_min:before,
	html.zh-HK .experience_contents.head_min:after {
		height: 180px;
	}
}

.experience_contents  .header_item .cat_title_sub {
	position: absolute;
	bottom: -100px;
	left: -20px;
	width: 290px;
	height: 260px;
	padding-top: 5rem;
	background: url(/japan-travel-planner/feature/beloved-hokkaido/images/komagatake/main_title_bg.png) no-repeat;
	-webkit-background-size: 100%;
	background-size: 100%;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	font-size: 30px;
	color: #fff;
	text-align: center;
	font-weight: bold;
}
@media screen and (max-width: 949px) {
	.experience_contents  .header_item .cat_title_sub {
		left: 10px;
		bottom: -30px;
		width: 120px;
		height: 100px;
		padding-top: 2rem;
		font-size: 15px;
	}
}




/* arrow
============================================================================================================ */
.experience_contents .arrow {
	position: relative;
	padding-top: 50px;
	z-index: 9;
  margin-top:-90px;
}
.experience_contents .arrow:before,
.experience_contents .arrow:after {
	content: "";
	position: absolute;
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	-o-transform: translateX(-50%);
	transform: translateX(-50%);
	z-index: -1;
}
.experience_contents .arrow:before {
	bottom: 0;
	top: 265px;
	left: 50%;
	width: 326px;
	background-color: #e3effb;
}
.experience_contents .arrow:after {
	top: 0;
	left: 50%;
	border-style: solid;
	border-width: 0 163px 265px 163px;
	border-color: transparent transparent #e3effb transparent;
}
@media screen and (max-width: 949px) {
	.experience_contents .arrow {
		padding-top: 25px;
	}
	.experience_contents .arrow:before {
		top: 27.1vw;
		width: 33.4vw;
	}
	.experience_contents .arrow:after {
		border-width: 0 16.7vw 27.1vw 16.7vw;
	}
}

@media screen and (max-width: 768px) {
	html.en .experience_contents .arrow {
		padding-top: 45px;
	}
}

/* experience_lead
============================================================================================================ */
.experience_lead {
	margin-bottom: 15px;
	text-align: center;
	font-size: 21px;
	line-height: 1.7;
	font-weight: bold;
	color: #234cb1;
}
@media screen and (max-width: 949px) {
	.experience_lead {
		padding: 0 10px;
		margin-bottom: 15px;
		font-size: 12px;
	}
}



/* experience_nav
============================================================================================================ */
.experience_nav {
	width: 950px;
	margin: auto;
}
.experience_nav > ul > li a {
	display: table;
	width: 100%;
	height: 70px;
	border-bottom: 3px solid #e3effb;
	color: #234cb1;
	text-align: center;
	font-size: 27px;
	line-height: 1.4;
	font-weight: bold;
	font-style: italic;
	text-decoration: none;
	-webkit-transition: border .2s, opacity .2s;
	-o-transition: border .2s, opacity .2s;
	transition: border .2s, opacity .2s;
}
.experience_nav > ul > li a > * {
	display: table-cell;
	vertical-align: middle;
	font-style: italic;
}
.experience_nav > ul > li a.current {
	border-color: #234cb1;
	opacity: .5;
}
@media (min-width: 950px), print {
	.experience_nav > ul {
		padding: 0 1px;
	}
	.experience_nav > ul:after {
		content: ""; display: table; clear: both;
	}
	.experience_nav > ul > li {
		float: left;
		width: 311px;
	}
	.experience_nav > ul > li:nth-child(2){
		width: 326px;
	}
	.experience_nav > ul > li a[href]:hover {
		border-color: #234cb1;
		opacity: .5;
	}
}
@media screen and (max-width: 949px) {
	.experience_nav {
		width: auto;
		margin-top: 50px;
		padding-bottom: 40px;
	}
	.experience_nav h1 {
		margin-bottom: 10px;
		text-align: center;
		font-size: 25px;
		font-style: italic;
	}
	.experience_nav > ul {
		display: table;
		width: 100%;
		table-layout: fixed;
		border-spacing: 10px;
	}
	.experience_nav > ul > li {
		display: table-cell;
		vertical-align: middle;
	}
	.experience_nav > ul > li a {
		height: 60px;
		border-bottom: 0;
		border-spacing: 0;
		background-color: #234cb1;
		color: #fff;
		font-size: 15px;
	}
}


/* index_ph
============================================================================================================ */
.index_ph {
	position: relative;
}
.index_ph a {
	position: relative;
	display: block;
	text-decoration: none;
	font-size: 18px;
	line-height: 1.4;
	font-weight: bold;
	color: #333333;
}
.index_ph a span {
	display: block;
}
.index_ph a .box {
	background-color: #fff;
}
.index_ph a .category {
	position: absolute;
	left: -30px;
	top: 334px;
	padding: 10px 15px;
	background-color: #234cb1;
	font-size: 18px;
	color: #fff;
	z-index: 3;
	font-style: italic;
}
.index_ph a .box span + span {
	margin-top: 10px;
}
.index_ph a .box .blue {
	color: #234cb1;
}
.index_ph a .box .txt {
	font-weight: normal;
}
@media screen and (min-width: 950px), print {
	.index_ph {
		margin: 70px 0 50px;
		background: url(/japan-travel-planner/feature/beloved-hokkaido/images/komagatake/index_ph_bg.png) repeat-x 50% 120px;
		overflow: hidden;
	}
	.index_ph > div {
		position: relative;
		left: 50%;
		width: 1830px;
		-webkit-transform: translateX(-50%);
		-ms-transform: translateX(-50%);
		-o-transform: translateX(-50%);
		transform: translateX(-50%);
	}
	.index_ph li {
		width: 610px;
	}
	.index_ph a .category {
		-webkit-transition: .5s -webkit-transform;
		-o-transition: .5s -o-transform;
		transition: .5s transform;
		-webkit-transform: translate(140px, -50px);
		-ms-transform: translate(140px, -50px);
		-o-transform: translate(140px, -50px);
		transform: translate(140px, -50px);
	}
	.index_ph a .contents {
		-webkit-transition: .5s -webkit-transform, .8s opacity;
		-o-transition: .5s -o-transform, .8s opacity;
		transition: .5s transform, .8s opacity;
		-webkit-transform: scale(.54);
		-ms-transform: scale(.54);
		-o-transform: scale(.54);
		transform: scale(.54);
		opacity: .8;
	}
	.index_ph a .ph {
		position: relative;
		z-index: 2;
	}
	.index_ph a .box {
		margin-top: -30px;
		padding: 55px 25px 20px;
		opacity: 0;
		-webkit-transform: translate(0, -100%);
		-ms-transform: translate(0, -100%);
		-o-transform: translate(0, -100%);
		transform: translate(0, -100%);
		-webkit-transition: .6s -webkit-transform, .8s opacity;
		-o-transition: .6s -o-transform, .8s opacity;
		transition: .6s transform, .8s opacity;
	}

	.index_ph .slick-center a .category {
		-webkit-transform: translate(0);
		-ms-transform: translate(0);
		-o-transform: translate(0);
		transform: translate(0);
	}
	.index_ph .slick-center a .contents {
		-webkit-transform: scale(1);
		-ms-transform: scale(1);
		-o-transform: scale(1);
		transform: scale(1);
		opacity: 1;
	}
	.index_ph .slick-center a .box {
		opacity: 1;
		-webkit-transform: translate(30px, 0);
		-ms-transform: translate(30px, 0);
		-o-transform: translate(30px, 0);
		transform: translate(30px, 0);
	}
}
@media screen and (max-width: 949px) {
	.index_ph {
		margin-top: 30px;
	}
	.index_ph li {
		width: 320px;
		padding: 0 10px;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
	}
	.index_ph a {
		font-size: 12px;
	}
	.index_ph a .ph {
		position: relative;
	}
	.index_ph a .box {
		padding: 10px;
	}
	.index_ph a .category {
		left: 0;
		top: auto;
		bottom: 0;
		padding: 8px 15px;
		font-size: 12px;
	}
	.index_ph a .box span + span {
		margin-top: 5px;
	}
	.index_ph a .box .txt {
		display: none;
	}
}
@media screen and (max-width: 370px) {
	.index_ph li {
		width: 280px;
		padding: 0 5px;
	}
}

/* category_ph
============================================================================================================ */
.category_ph {
	width: 950px;
	margin: 60px auto 40px;
}
.category_ph ul {
}
.category_ph ul:after {
	content: ""; display: table; clear: both;
}
.category_ph li a {
	display: block;
	text-decoration: none;
	color: #333;
}
.category_ph li a span {
	display: block;
}
.category_ph li a .box {
	padding: 15px 20px;
	background-color: #fff;
	font-size: 14px;
	font-weight: bold;
}
.category_ph li a .box span + span {
	margin-top: 10px;
}
.category_ph li a .box .blue {
	color: #234cb1;
}
.category_ph li a .box .txt {
	font-weight: normal;
}

@media (min-width: 950px), print {
	.category_ph li {
		float: left;
		width: 450px;
		padding-bottom: 70px;
	}
	.category_ph li:nth-child(2n) {
		float: right;
		-webkit-transform: translateY(50px);
		-ms-transform: translateY(50px);
		-o-transform: translateY(50px);
		transform: translateY(50px);
	}
	.category_ph li:nth-child(2n+1) {
		clear: both;
	}
}

@media screen and (max-width: 949px) {
	.category_ph {
		width: auto;
		margin: 30px 20px 0;
	}
	.category_ph li {
		max-width: 467px;
		margin: 0 auto 20px;
	}
	.category_ph li a .box {
		padding: 10px 15px;
		font-size: 11px;
	}
	.category_ph li a .box span + span {
		margin-top: 5px;
	}
}


/* experience_detail
============================================================================================================ */
.experience_detail {
	width: 900px;
	margin: 0 auto 40px;
	font-size: 18px;
}
.experience_detail > h1 {
	margin-bottom: 40px;
	text-align: center;
	font-size: 36px;
	color: #234cb1;
}
.experience_detail dl {
	margin-top: 50px;
}
.experience_detail dl dt {
	margin-bottom: 20px;
}
.experience_detail .back_btn {
	margin: 50px 0;
	text-align: center;
}
.experience_detail .back_btn a {
	display: inline-block;
	min-width: 580px;
	padding: 30px;
	background-color: #2c4dac;
	color: #fff;
	font-size: 30px;
	font-weight: bold;
	font-style: italic;
	text-decoration: none;
}

@media screen and (max-width: 949px) {
	.experience_detail {
		width: auto;
		margin: 0 20px 40px;
		font-size: 12px;
	}
	.experience_detail > h1 {
		margin-bottom: 20px;
		font-size: 20px;
	}
	.experience_detail dl {
		margin-top: 30px;
	}
	.experience_detail dl dt {
		margin-bottom: 10px;
	}
	.experience_detail .back_btn {
		margin: 30px 0;
	}
	.experience_detail .back_btn a {
		display: block;
		min-width: 0;
		padding: 20px;
		font-size: 15px;
	}
}