@charset 'UTF-8';

/* ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■

	トップページ

■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■ */

.top_itemlist ul li:nth-of-type(n+5){
	display:none;
}


/* ================================================================================

	Site origin 30pxマージン解除
	※案件によって使い分けてください。

================================================================================ */

/* PC設定
----------------------------------------------- */
@media (min-width: 768px) {

	.panel-grid{
		margin:0 auto !important;
	}
	.panel-grid-cell{
		margin:0 auto !important;
	}
	.so-panel{
		margin:0 auto !important;
	}

}



/* SP設定
----------------------------------------------- */
@media (max-width: 767px) {

	.panel-grid{
		margin:0 auto !important;
	}
	.panel-grid-cell{
		margin:0 auto !important;
	}
	.so-panel{
		margin:0 auto !important;
	}

}




/* ================================================================================

	レイアウト

================================================================================ */

/* PC設定
----------------------------------------------- */
@media (min-width: 768px) {
	#wrapper{
	}

	main.outer_wrap{
		position:relative;
		max-width:1920px;
		width:100%;
		min-height:50vh;
		background:url(../img/) center top no-repeat;
		background-color:#FFFFFFF;
		display:block;
		margin:0 auto;
	}

	.inner_wrap{
		position:relative;
	}
	.monokuro img{
	-webkit-filter: grayscale(100%);
	-moz-filter: grayscale(100%);
	-ms-filter: grayscale(100%);
	-o-filter: grayscale(100%);
	filter: grayscale(100%);
	width: 100% !important;
	}
	.top_03{
		padding:0 0 10vw 0;
	}




	
	header{
		position:absolute;
		z-index:1;
		background-color:transparent;
	}
}




/* SP設定
----------------------------------------------- */
@media (max-width: 767px) {
	#wrapper{
	}

	main.outer_wrap{
		position:relative;
		width:100%;
		background:url(../img/) center top no-repeat;
		background-color:#FFFFFFF;
	}

	.inner_wrap{
		position:relative;

	}
	.monokuro img{
	-webkit-filter: grayscale(100%);
	-moz-filter: grayscale(100%);
	-ms-filter: grayscale(100%);
	-o-filter: grayscale(100%);
	filter: grayscale(100%);
	}
}




/* ================================================================================

	メイン画像

================================================================================ */


/* PC設定
----------------------------------------------- */
@media (min-width: 768px) {
	.top_main_pc_link:hover{
		opacity:1;
	}

	.top_main_pc{
		background:
			url(../img/logo_clinch2.png) right 3vw bottom 3vw no-repeat,
			url(../img/top_main04.jpg) center top no-repeat;
		background-size: 12vw auto,cover;
		background-color: #1c1817;
		padding:0 0 0 0;
		height: 100vh;
		display:flex;
		align-items:center;
	}
	.top_main_pc > div{
		margin:0 auto;
	}
	.main_top_copy{
		color: #FFFFFF;
		font-size: 3vw;
		font-family: 'EB Garamond', serif;
		letter-spacing: 0.05em;
		text-align: center;
		line-height: 1.3;
		padding-top: 4vw;
	}
	.main_top_copy span{
		color: #FFFFFF;
		font-size: 2vw;
	}
	.top_main_pc a{
		margin:0 auto;
		display:block;
	}




	.caption{
		margin: -29vw 0 28vw 0;
		padding: 0 0 0 0;
		font-size: 3vw;
		color: #FFFFFF;
		letter-spacing: 0.1vw !important;
		text-align:center;
		font-family: 'Yantramanav', sans-serif!important;
		font-weight:100!important;
	}
	.caption h3{
		font-family: 'EB Garamond', serif;
		font-weight:100!important;
	}


}


/* SP設定
----------------------------------------------- */
@media (max-width: 767px) {
	.top_main_pc_link:hover{
		opacity:1;
	}

	.top_main_pc{
		background:
			url(../img/logo_clinch2.png) right 7vw bottom 7vw no-repeat,
			url(../img/top_main_sp04.jpg)center top no-repeat;
		-moz-background-size:20vw auto,100% auto;
		background-size:20vw auto,100% auto;
		padding:0 0 0 0;
		height: 136vw;
		display:flex;
		align-items:center;
	}
	.top_main_pc > div{
		margin:0 auto;
	}
	
	.main_top_copy{
		line-height: 1.4;
	}
	.main_top_copy span{
		font-size: 4vw;
	}
	
	.top_main_pc{
		text-align:center;
	}
	.top_main_pc a{
		color: #FFFFFF;
		font-size: 6vw;
		letter-spacing: 0.05em;
		font-family: 'EB Garamond', serif;
		display: block;
		margin: 0 auto;
	}
	.caption{
		margin: -93vw 0 79vw 0;
		padding: 0 0 0 0;
		font-size: 6vw;
		color: #FFFFFF;
		letter-spacing: 0.1vw !important;
		text-align: center;
	}
	.caption h3{
		font-family: 'EB Garamond', serif;
		font-weight: 600 !important;
	}
}




/* ================================================================================

	TOP_01

================================================================================ */


/* PC設定
----------------------------------------------- */
@media (min-width: 768px) {
	.top_01_midashi{
		padding: 8.5vw 0 0vw 0;
		margin:0 0 0 0;
	}
	.top_01_midashi h3{
		font-family: 'Crimson Text', serif;
		text-align: center;
		padding:3vw 0 0 0;
		margin: 0 0 0 0;
		margin-top: 0px;
		font-size: 2.5vw;
		font-weight: 100 !important;
		line-height: 4vw;
		font-weight: normal;
		letter-spacing: 0.05em;
	}
	.top_itemlist ul{
		font-size:0;
		margin: 0 auto 9vw;
		width:90vw;
	}
	.top_itemlist li{
		display:inline-block;
		width: calc(100% / 4);
		text-align:center;
		font-size:1.2vw;
		font-family: 'Crimson Text', serif;
		font-weight: 300;
	}
	.top_itemlist img{
		width:100%;
		height:20vw;
		object-fit: cover;
		font-family: 'object-fit: cover;'; /* IE対策 */
	}
	.new_title{
		padding: 1vw 0 0 0;
		font-family: 'Crimson Text', serif;
		font-size:;
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
	}
}


/* SP設定
----------------------------------------------- */
@media (max-width: 767px) {
	.top_01_midashi{
		padding: 2.2vw 0 0vw 0;
		margin:0 0 0 0;
	}
	.top_01_midashi h3{
		font-family: 'Crimson Text', serif;
		text-align:center;
		padding:0 0 0 0;
		margin:0 0 0 0;
		font-size: 10vw;
		font-weight: 300 !important;
	}
	.top_itemlist ul{
		margin: 16vw auto 18vw;
		width: 69vw;
	}
	.top_itemlist li{
		text-align:center;
		font-family: 'Crimson Text', serif;
		font-weight: 300;
		letter-spacing: 0.05em;
		margin-bottom:6vw;
	}
	.top_itemlist img{
		width:100%;
		height:60vw;
		object-fit: cover;
		font-family: 'object-fit: cover;'; /* IE対策 */
	}
}





/* ================================================================================

	top_02

================================================================================ */


/* PC設定
----------------------------------------------- */
@media (min-width: 768px) {

	.top_02{
		width:100%;
		margin: 0 auto 0.2vw !important;
		padding:0 0.7vw;
	}
	.top_02 > div{
		width: 33.3333% !important;
		margin: 0 !important;
		padding-right:0.7vw;
		height: 20.6vw;
	}
	.top_02 > div:last-of-type{
		padding-right:0;
	}
	.top_03{
		width:100%;
		margin: 0 auto;
		padding:0 0.7vw 0;
	}
	.top_03 > div{
		 width : calc(100% / 2) !important;
	  	 margin: 0 !important;
		padding-right:0.7vw;
	}
	.top_03 > div:last-of-type{
		padding-right:0;
	}
	.top_02_cel{
		margin:0 0 0 0;
		padding:0 0 0 0;
	}
	.clomm01{
	}
	.clomm02{
	}
	.clomm03{
	}
	/* ボタンのホバー動作 */
	.bana-img01{
		overflow: hidden;
		width: 100%;
		height: 20.15vw;
		margin-bottom: 0px;
		margin: 0 auto 0.4vw;
	}
	.bana-img02{
		overflow: hidden;
		width: 100%;
		height: 32vw;
		margin-bottom: 0px;
		margin: 0 0vw 0 0;
		padding: 0;
	}
	.bana-img03{
		overflow: hidden;
		width: 100%;
		height: 32vw;
		margin-bottom: 0px;
	}
	.bana-img01 a,
	.bana-img02 a,
	.bana-img03 a {
		width: 100%;
	}
	.bana-img01:hover img,
	.bana-img02:hover img,
	.bana-img03:hover img{

	}
	.bana-img01 a:hover,
	.bana-img02 a:hover,
	.bana-img03 a:hover{
		opacity:1;
	}
	.bana-img01 a:hover img,
	.bana-img02 a:hover img,
	.bana-img03 a:hover img{
		opacity:0.7;
	}
	.top_02 h3.widget-title{
		position: absolute;
		margin: 19vw 0 0 1.5vw;
		z-index: 100000;
		font-family: 'Yantramanav', sans-serif;
		text-align: center;
		padding: 0 0 0 0;
		font-size: 4vw;
		font-weight: 100 !important;
		color: #FFFFFF;
	}
	.top_03 h3.widget-title{
		position: absolute;
		margin: 16vw 0 0 1.5vw;
		z-index: 100000;
		font-family: 'Yantramanav', sans-serif;
		text-align: center;
		padding: 0 0 0 0;
		font-size: 4vw;
		font-weight: 100 !important;
		color: #FFFFFF;
	}
	/* テキスト */
	.bana-text{
		font-size: 15px;
		color:#222222;
		padding: 70px 0 0 93px;
		font-feature-settings: "palt" 1;
		-webkit-font-feature-settings: 'palt' 1;
		letter-spacing: 1px;
		line-height: 2;
		
	}
	.widget-title{
		display:none;
	}
	.bana-text p{
		margin-bottom: 30px !important;
	}
	.bana_text_midashi{
		font-size: 19px;
		padding: 0 0 22px 0;
		font-family: "游明朝",YuMincho,"ヒラギノ明朝 ProN W2","Hiragino Mincho ProN","Sawarabi Mincho","HG明朝B","メイリオ",Meiryo,serif !important;
		line-height: 34px;
		font-weight: 400;
		color: #396a81;
	}
}


/* SP設定
----------------------------------------------- */
@media (max-width: 767px) {

	.top_02_cel{
		height:68vw !important;
	}

	.bana-img02{
		overflow: hidden;
		width: 100%;
		margin-bottom:1vw;
	}


	.widget-title{
		display:none;
	}
	
}