@charset "utf-8";

.contents {
	width: 100%;
	height: 100%;
	background-color: #000;
}
.contents .inner {
	display: flex;
	flex-flow: row nowrap;
}
.contents .inner .contentsleft {
	display: flex;
	flex-flow: row wrap;
	width: 1452px;
}

/* contents menu */
.contents .inner .contentsMenu {
	width: 148px;
	background-color: #00040c;
	padding: 48px 0 0 50px;
}
.contents .inner .contentsMenu .menuicon {
	position: relative;
	width: 48px;
	margin-bottom: 50px;
	cursor: pointer;
}
.contents .inner .contentsMenu .menuicon .submenutitle {
	position: absolute;
	top: 50px;
	left: -24px;
	width: 100px;
	color: #fff;
	text-align: center;
	padding: 0;
	
}
.contents .inner .contentsMenu .menuicon .submenu {
	position: absolute;
	top: -24px;
	right: -300px;
	width: 300px;
	padding: 0 0 0 24px;
	
}
.contents .inner .contentsMenu .menuicon .submenu .menus {background:rgba(0,0,0,0.7);}
.contents .inner .contentsMenu .menuicon .submenu .menus a {
	display: block;
	color: #fff;
	padding: 6px;
	border-bottom: solid 1px #ccc;
}

/* key visual */
.contents .inner .contentsleft .photo {width: 640px; height: 427px;}
.contents .inner .contentsleft .photo.vertical {width: 480px; height: 720px;}
.contents .inner .contentsleft .photo.square {width: 640px; height: 640px;}
.contents .inner .contentsleft .news {
	width: 812px;
	height: 427px;
	color: #fff;
	background: url("../images/common/photo_bk.jpg") no-repeat top center;
    background-size: cover; /* contain */
	padding: 100px 0 0 180px;
}
.contents .inner .contentsleft .news.vertical {width: 972px; height: 720px; padding: 180px 0 0 180px; background-size:cover;}
.contents .inner .contentsleft .news.square {height: 640px; padding: 180px 0 0 180px; background-size:cover;}
.contents .inner .contentsleft .news.top_Guide {padding: 50px 20px 0 180px;}
.contents .inner .contentsleft .news .title {
	font-size: 32px;
	margin-bottom: 40px;
}
.contents .inner .contentsleft .news.top_Guide .title {margin-bottom: 20px;}
.contents .inner .contentsleft .news .news_Wrapper {
	width: 490px;
	padding: 0;
}
.contents .inner .contentsleft .news .news_Wrapper .each {
	display: flex;
	flex-flow: row nowrap;
	line-height: 1.5;
	margin-bottom: 10px;
}
.contents .inner .contentsleft .news .news_Wrapper .each .date {width: 110px;}
.contents .inner .contentsleft .news .news_Wrapper .each .item {width: 380px;}
.contents .inner .contentsleft .news .news_Wrapper .each .item a {color: #fff;}
.contents .inner .contentsleft .news .news_Wrapper .backnumber {width: 100%; text-align: right; margin-top: 20px;}
.contents .inner .contentsleft .news .news_Wrapper .backnumber a {color: #fff;}
.contents .inner .contentsleft .pankuzu {
	width: 1452px;
	height: 48px;
	color: #fff;
	line-height: 48px;
	padding-left: 50px;
}
.contents .inner .contentsleft .pankuzu a {color: #fff;}

/* key visual (special) */
.contents .inner .contentsleft .photo.sp {
	width: 640px;
	height: auto;
	min-height: 427px;
	background-color: #202020;
}
.contents .inner .contentsleft .photo.sp.vertical {
	width: 480px;
	height: auto;
	min-height: 720px;
	background-color: #202020;
}
.contents .inner .contentsleft .photo.sp.photopattern1 {
	width: 730px;
	height: auto;
	min-height: 355px;
	background-color: #202020;
}
.contents .inner .contentsleft .photo.sp.vertical.photopattern2 {min-height: 640px;}
.contents .inner .contentsleft .photo.sp.photopattern3 {min-height: 480px;}
.contents .inner .contentsleft .photo.sp .spimg {height: auto;}
.contents .inner .contentsleft .photo.sp .link a {
	font-size: 16px;
	color: #fff;
	line-height: 1em;
	padding: 0.5em 0 0.5em 1em;
}
.contents .inner .contentsleft .news.sp {height: auto; min-height: 427px;}
.contents .inner .contentsleft .news.sp.vertical {height: auto; min-height: 720px;}
.contents .inner .contentsleft .news.sp.photopattern1 {width: 722px; height: auto; min-height: 355px; padding: 50px 0 0 90px;}
.contents .inner .contentsleft .news.sp.vertical.photopattern2 {min-height: 640px;}
.contents .inner .contentsleft .news.sp.photopattern3 {min-height: 480px;}

/* key visual (bar) */
.contents .inner .contentsleft .photo_bar {
	width: 100%;
	display: none;
}
.contents .inner .contentsleft .news_bar {
	width: 100%;
	color: #fff;
	padding: 50px 0 20px 50px;
}
.contents .inner .contentsleft .news_bar .title {
	font-size: 32px;
	margin-bottom: 40px;
}

/* contents area */
.contents .inner .contentsleft .contentsArea {
	width: 1452px;
	background-color: #f0f0f0; /* #fff */
	padding: 30px 63px; /* 60px 126px */
}
.contents .inner .contentsleft .contentsArea a {color: #0066ff;}
.contents .inner .contentsleft .contentsArea .blockArea {
	width: 100%;
	background-color: #fff;
	padding: 30px 63px;
	margin-bottom: 30px;
}
.contents .inner .contentsleft .contentsArea .blockArea.blockmt {margin-top: 30px;}

/* ---------- @media settings ---------- */
@media only screen and (max-width: 1600px) {

.contents .inner .contentsleft {width: 1152px;}

/* key visual */
.contents .inner .contentsleft .photo {width: 480px; height: 320px;}
.contents .inner .contentsleft .photo.vertical {width: 320px; height: 480px;}
.contents .inner .contentsleft .photo.square {width: 480px; height: 480px;}
.contents .inner .contentsleft .news {
	width: 672px;
	height: 320px;
	padding: 50px 0 0 130px;
}
.contents .inner .contentsleft .news.top_Guide {padding: 30px 20px 0 80px;}
.contents .inner .contentsleft .news.vertical {width: 832px; height: 480px; padding: 100px 0 0 180px;}
.contents .inner .contentsleft .news.square {height: 480px; padding: 180px 0 0 130px;}	
.contents .inner .contentsleft .news.top_Guide .title {margin-bottom: 10px;}
.contents .inner .contentsleft .news.top_Guide .top_Guide_txt {line-height: 1.3;}

/* key visual (special) */
.contents .inner .contentsleft .photo.sp {width: 480px; min-height: 320px;}
.contents .inner .contentsleft .photo.sp.vertical {width: 320px; min-height: 480px;}
.contents .inner .contentsleft .photo.sp.photopattern1{width: 548px; min-height: 280px;}
.contents .inner .contentsleft .photo.sp.vertical.photopattern2 {min-height: 428px;}
.contents .inner .contentsleft .photo.sp.photopattern3 {min-height: 408px;}
.contents .inner .contentsleft .news.sp {min-height: 320px;}
.contents .inner .contentsleft .news.sp.vertical {min-height: 480px;}
.contents .inner .contentsleft .news.sp.photopattern1{width: 604px; min-height: 280px; padding: 20px 0 0 60px;}
.contents .inner .contentsleft .news.sp.photopattern1 .title {margin-bottom: 10px;}
.contents .inner .contentsleft .news.sp.vertical.photopattern2 {min-height: 428px;}
.contents .inner .contentsleft .news.sp.photopattern3 {min-height: 408px;}

/* contents area */
.contents .inner .contentsleft .contentsArea {
	width: 1152px;
	padding: 30px 33px; /* 60px 66px */
}
.contents .inner .contentsleft .contentsArea .blockArea {padding: 30px 33px; margin-bottom: 30px;}
.contents .inner .contentsleft .pankuzu.sm {
	height: 80px;
	line-height: 1.5;
	padding: 12px 0 0 50px;
}

} /* ---@media max1600--- */

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

.contents .inner .contentsleft {width: 1024px;}

/* key visual */
.contents .inner .contentsleft .photo {width: 480px; height: 320px;}
.contents .inner .contentsleft .photo.vertical {width: 320px; height: 480px;}
.contents .inner .contentsleft .photo.square {width: 480px; height: 480px;}
.contents .inner .contentsleft .news {
	width: 544px;
	height: 320px;
	padding: 50px 0 0 80px;
}
.contents .inner .contentsleft .news.vertical {width: 704px; height: 480px; padding: 80px 0 0 120px;}
.contents .inner .contentsleft .news.square {height: 480px; padding: 80px 0 0 80px;}
.contents .inner .contentsleft .news.top_Guide {padding: 30px 0 0 80px;}
.contents .inner .contentsleft .news .title {font-size: 24px; margin-bottom: 30px;}
.contents .inner .contentsleft .news.top_Guide .title {margin-bottom: 10px;}
.contents .inner .contentsleft .news.top_Guide .top_Guide_txt {line-height: 1.3;}
.contents .inner .contentsleft .news .news_Wrapper {width: 420px;}
.contents .inner .contentsleft .news.vertical .news_Wrapper {width: 490px;}
.contents .inner .contentsleft .news.square .news_Wrapper {width: 420px;}
.contents .inner .contentsleft .news .top_Guide_txt {width: 420px;}

/* key visual (special) */
.contents .inner .contentsleft .photo.sp.photopattern1{width: 548px; min-height: 280px;}
.contents .inner .contentsleft .news.sp.photopattern1{width: 476px; min-height: 280px; padding: 20px 0 0 60px;}
.contents .inner .contentsleft .news.sp.vertical.photopattern2 {height: 464px;}

/* key visual (bar) */
.contents .inner .contentsleft .news_bar {padding: 30px 0 20px 30px;}
.contents .inner .contentsleft .news_bar .title {font-size: 24px; margin-bottom: 20px;}

/* contents menu */
.contents .inner .contentsMenu {display: none;}

/* contents area */
.contents .inner .contentsleft .contentsArea {
	width: 1024px;
	padding: 30px 33px;
}

} /* ---@media max1299--- */

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

.contents {width: 100vw;}
.contents .inner .contentsleft {width: 100vw;}

/* contents menu */
.contents .inner .contentsMenu {display: none;}

/* key visual */
.contents .inner .contentsleft .photo {width: 80vw; height: auto; margin: 4vw auto;}
.contents .inner .contentsleft .photo.vertical {width: 50vw; height: auto; margin: 4vw auto;}
.contents .inner .contentsleft .photo.square {width: 65vw; height: auto; margin: 4vw auto;}
.contents .inner .contentsleft .news {
	width: 80vw;
	height: auto;
	background: #000;
	margin: 0 auto;
	padding: 4vw 0;
}
.contents .inner .contentsleft .news.vertical {width: 80vw; height: auto; padding: 4vw 0; background: #000;}
.contents .inner .contentsleft .news.square {width: 80vw; height: auto; padding: 4vw 0 ; background: #000;}
.contents .inner .contentsleft .news.top_Guide {padding: 0 0 4vw;}
.contents .inner .contentsleft .news .title {
	font-size: 6vw;
	margin-bottom: 4vw;
}
.contents .inner .contentsleft .news.top_Guide .top_Guide_txt {width: 80vw; line-height: 1.3;}
.contents .inner .contentsleft .news .news_Wrapper {
	width: 100%;
	padding: 0;
}
.contents .inner .contentsleft .news .news_Wrapper .each {margin-bottom: 4vw;}
.contents .inner .contentsleft .news .news_Wrapper .each .date {width: 20vw;}
.contents .inner .contentsleft .news .news_Wrapper .each .item {width: 60vw;}
.contents .inner .contentsleft .news .news_Wrapper .backnumber {margin-top: 4vw;}
.contents .inner .contentsleft .pankuzu {display: none;}

/* key visual (special) */
.contents .inner .contentsleft .photo.sp {width: 80vw; height: auto;}
.contents .inner .contentsleft .photo.sp.vertical {width: 50vw; height: auto;}
.contents .inner .contentsleft .photo.sp.photopattern1 {width: 80vw; height: auto;}
.contents .inner .contentsleft .photo.sp.vertical.photopattern2 {height: auto;}
.contents .inner .contentsleft .photo.sp.photopattern3 {height: auto;}
.contents .inner .contentsleft .photo.sp .link a {font-size: 3vw;}
.contents .inner .contentsleft .news.sp.vertical {height: auto; min-height: auto;}
.contents .inner .contentsleft .news.sp.vertical .news_Wrapper {width: 100%;}
.contents .inner .contentsleft .news.sp.photopattern1 {width: 80vw; padding: 4vw 0;}
.contents .inner .contentsleft .news.sp.vertical.photopattern2 {height: auto;}
.contents .inner .contentsleft .news.sp.photopattern3 {height: auto;}

/* key visual (bar) */
.contents .inner .contentsleft .photo_bar {width: 100%;}
.contents .inner .contentsleft .news_bar {
	width: 100%;
	padding: 4vw;
}
.contents .inner .contentsleft .news_bar .title {
	font-size: 6vw;
	margin-bottom: 4vw;
}

/* contents area */
.contents .inner .contentsleft .contentsArea {
	width: 100vw;
	padding: 2vw;	/* 4vw */
}
.contents .inner .contentsleft .contentsArea .blockArea {padding: 2vw; margin-bottom: 2vw;}
.contents .inner .contentsleft .contentsArea .blockArea.blockmt {margin-top: 2vw;}

} /* ---@media max1024--- */