@charset "utf-8";
/* CSS Document */
.mt10{margin-top:10px !important;}
.mt20{margin-top:20px !important;}
.mt30{margin-top:30px !important;}
.mt40{margin-top:40px !important;}
.mt50{margin-top:50px !important;}
.mt60{margin-top:60px !important;}

.mb10{margin-bottom:10px !important;}
.mb20{margin-bottom:20px !important;}
.mb30{margin-bottom:30px !important;}
.mb40{margin-bottom:40px !important;}
.mb50{margin-bottom:50px !important;}
.mb60{margin-bottom:60px !important;}


/*
【360新潟レスポンシブ設計定義】
1200px～：PC
801px～1199px：タブレット（タブレット専用デザインは作成しない、基本的にスマホのデザインを適用するがPCのデザインで問題ない場合に限りPCのデザインも適用可能とする）
～800px：スマホ
*/

/* PC・タブレット・スマホ共通の設定（PC用の設定を記述） */


.fl_left{
	float:left;
}
.fl_right{
	float:right;
}
.clearfix::after{
  content: "";
  display: block;
  clear: both;
}


.column_bg{
	background-color:#FFFFF0;
}
.sub_color{
	color:#EC6A50;
	font-weight:bold;
}
.aligncenter{
	text-align:center;
}

.feature_content{
	line-height:1.8;
}
.feature_content .main_visual{
	margin: 0 0 40px;
	width:100%;
}
.feature_content .main_visual img{
	width:100%;
}
.feature_content .column{
	width:1000px;
	margin:0 auto 50px;
}
.feature_content .column h2{
	margin:0 0 40px;
}
.feature_content .column h3{
	font-size: 28px;
    font-weight: bold;
    color: #3E3A39;
    font-family: "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ",Meiryo,"ＭＳ Ｐゴシック",sans-serif;
    margin: 0 0 10px;
}
.feature_content .column > p{
	margin:0 0 40px;
}
.feature_content .column > figure{
	margin:0 0 40px;
}
.feature_content .column > a, .feature_content .column02 > a{
	color:#EC6A50;
	font-weight:bold;
}

.feature_content .column .column_inner{
	display:flex;
	justify-content: space-between;
}
.feature_content .column .column_inner h3{
	color:#F42424;
	font-size:18px;
	font-weight:bold;
	margin:0 0 20px;
}
.feature_content .column .column_inner .txt{
	width:480px;
}
.feature_content .column .column_inner .img{
	width:480px;
}
.feature_content .column .column_inner .img img{
	width:100%;
}

.feature_content .column02 {
	margin:0 0 30px;
}
.experience_inner02 a {
	border: solid 1px #dfdfdf;
    margin: 0 0 20px;
}
.experience_inner02 .column03 {
    padding: 19px 10px;
    display: flex;
    align-items: center;
    width: 242px;
    position: relative;
}
.experience_inner02 .column03 figure {
    width: 48px;
    margin: 0 5px 0 0;
}
.experience_inner02 .column03 figure img {
    width: 100%;
}

.experience {
    clear: both;
    padding-top: 100px;
}
.experience_block1 {
    width: 1200px;
    overflow: hidden;
    margin: 2vw auto;
}
.genre-content {
    clear: both;
    padding-top: 20px;
    padding-bottom: 80px;
}
.ex-genre-box .genre_block1 {
    width: 100%;
}
.genre_block1 {
    width: 1200px;
}
.genre_block1 .experience_inner {
    width: 1000px;
    overflow: hidden;
    margin: 1vw auto;
}
.ex .ttl-01 {
    background-image: url(../images/experience/exp_ttl_01.png);
    border-bottom: none;
}
.ex .ex-genre-ttl {
    width: 98%;
    background-size: 100%;
    background-repeat: no-repeat;
    height: 4vw;
    margin: 0 auto;
    padding: .6vw 0 0 0;
}
.experience_block1 li .img {
    width: 242px;
    height: 172px;
    overflow: hidden;
    position: relative;
}
.ex-genre-box .img {
    background: none;
}
.experience_block1 ul {
    margin: 1% 0;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-box;
    display: -webkit-flexbox;
    display: -moz-flexbox;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: flex;
    -webkit-box-lines: multiple;
    -moz-box-lines: multiple;
    -webkit-flex-wrap: wrap;
    -moz-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}
.experience_block1 li {
    float: left;
    margin-left: 0;
    margin-right: 16px;
    margin-bottom: 1vw;
    width: 242px;
    height: 18vw;
    text-align: left;
}
.experience_block1 li.box {
    float: left;
    margin-left: 16px;
    margin-right: 16px;
    margin-bottom: 1vw;
    width: 242px;
    height: auto;
    text-align: left;
}

.experience_inner02{
	display:flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.experience_inner02 .column03:hover{
	opacity:0.7;
}
.experience_inner02 a{
	border:solid 1px #dfdfdf;
	margin:0 0 10px;
}
.experience_inner02 a.current{
	background-color:#f7f7f7;
}
.experience_inner02 .column03 p{
	font-size:14px;
}
.experience_inner02 .column03 figure{
	width:46px;
	margin:0 5px 0 0;
}
.experience_inner02 .column03 figure img{
	width:100%;
}
.experience_inner03{
	display:flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.experience_inner03 .column02{
	align-items: center;
	width:242px;
	position:relative;
}
.experience_inner03 .column02:hover{
	opacity:0.7;
}
.experience_inner03 .column02 p{
	font-size:14px;
}
.experience_inner03 .column02 figure img {
	width:242px;
	height:145px;
	object-fit:cover;
}
.experience_inner03 a{
	margin:0 0 10px;
}
.experience_inner03 a:nth-child(4n+1):last-child{
	margin-right: 76%;
}
.experience_inner03 a:nth-child(4n+2):last-child{
	margin-right: 50.6%;
}
.experience_inner03 a:nth-child(4n+3):last-child{
	margin-right: 25.3%;
}


/* タブレット・スマホ共通の設定（スマホ用の設定を記述、ただしタブレットに適用したくない場合はスマホ専用欄に記述） */
@media print, screen and (max-width: 1199px) { 
	.fl_left{
		float:inherit;
	}
	.fl_right{
		float:inherit;
	}


	.feature_content .main_visual img.sp_none{
		display: unset !important;
	}
	.feature_content .main_visual img.pc_none{
		display: none !important;
	}


	.feature_content{
		width:100%;
	}
	.feature_content figure img{
		width:100%;
	}
	.feature_content .column{
		width:96%;
		margin:0 auto 16.5vw;
	}
	.feature_content .column h2 img{
		width:100%;
	}

	.feature_content .column .column_inner .txt{
		width:100%;
	}
	.feature_content .column .column_inner .img{
		width:100%;
	}

	.feature_content .column02 > p{
		width:96%;
		margin:0 auto;
	}
	.feature_content .column02 > figure{
		width:96%;
		margin:0 auto;
	}

	.feature_content .column02 h2,
	.feature_content .column h2.how_h2{
		width:100%;
		font-size:23px;
		font-weight:bold;
		color:#FFF;
		font-family:  "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ",Meiryo,"ＭＳ Ｐゴシック",sans-serif;
		/*text-align:center;*/
		background-color:#EC6A50;
		/*background-position: center center;*/
		padding:30px 20px;
		/*background-size:cover;*/
	}
	.feature_content .column h3{
		font-size: 7.7vw;
	    font-weight: bold;
	    margin: 0 0 2.75vw;
	}
	.feature_content .column02 .column_inner > p{
		width:96%;
		margin:0 auto;
	}


	.experience_inner02{
		display:flex;
		justify-content: space-between;
		flex-wrap: wrap;
	}
	.experience_inner02::after{
		content:"";
		display: block;
		width:32%;
	}
	.experience_inner02 a{
		width:32%;
		display:flex;
		align-items: center;
		margin:0 0 2.75vw;
	}
	.experience_inner02 .column03{
		margin:0 0 2%;
		border:none;
		padding:1.65vw 0.825vw;
		width:100%;
		height:auto;
	}
	.experience_inner02 .column03:hover{
		opacity:1.0;
	}
	.experience_inner02 .column03:active{
		opacity:0.7;
	}
	.experience_inner02 .column03 figure{
		width:8.25vw;
	}
	.experience_inner02 .column03 p{
		font-size: 3.3vw;
		display: inline-block;
	}


	.experience_inner03{
		display:flex;
		justify-content: space-between;
		flex-wrap: wrap;
	}
	.experience_inner03::after{
	  content:"";
	  display: block;
	  width:32%;
	}
	.experience_inner03 a {
    	width: 49%;
    	display: flex;
    	align-items: start;
	}

	.experience_inner03 .column02{
		width:100%;
		margin:0 0 2%;
	}
	.experience_inner03 .column02 figure{
		width:100%;
	}
	.experience_inner03 .column02 figure img{
		width:45vw;
		height:27vw;
		object-fit:cover;
	}

	.experience_inner03 a:nth-child(4n+1):last-child{
		margin-right: 0;
	}
	.experience_inner03 a:nth-child(4n+2):last-child{
		margin-right: 0;
	}
	.experience_inner03 a:nth-child(4n+3):last-child{
		margin-right: 0;
	}
}


/* スマホ専用の設定（スマホ用の設定の内でタブレットに適用したくない設定） */
@media screen and (max-width: 800px) { 
	.feature_content .main_visual img.sp_none{
		display: none !important;
	}
	.feature_content .main_visual img.pc_none{
		display: unset !important;
	}
}