@charset "UTF-8";

@media screen and (min-width: 801px) {

	.swiper-wrapper{
		width: auto;
	}

	#value .intro{
		padding-bottom: 60px;
	}
	#value .intro p{
		line-height: 1.8;
	}


	#value .section-header span:before,
	#value .section-header span:after {
		width: calc(50% - 115px);
	}
	#symposium .section-header span:before,
	#symposium .section-header span:after {
		width: calc(50% - 65px);
	}

	#value main article{
		padding: 60px;
	}

	#voices .btn-more{
		margin-top: 60px;
	}
	#symposium .btn-more{
		margin-top: 60px;
	}

	.sec-title + div{
		margin-top: 40px;
	}
	.sec-inner + .sec-inner{
		margin-top: 60px;
	}

	.value-header-inner{
		margin-left: calc(-50vw + 50%);
		margin-right: calc(-50vw + 50%);
	}
	.value-header-inner img{
		width: 100%;
	}


	/* new-entry
	------------------------------------------------------------*/

	.new-entry{
		position: relative;
		overflow: hidden;
	}
	.new-entry-inner{
		position: relative;
		width: 1080px;
		transform-origin: top left;
	}
	.new-entry a{
		position: relative;
		display: block;
	}
	.new-entry a:after{
		content: "";
		position: absolute;
		top: 50%;
		right: 0;
		display: block;
		width: 30px;
		height: 30px;
		background: #d51322 url(/shared/img/arrow_wh_r.png) 50% 50% no-repeat;
		background-size: 10px 16px;
		z-index: 10;
	}
	.new-entry .txt{
		position: absolute;
		top: 50%;
		left: 0;
		min-width: 540px;
		display: inline-block;
		box-sizing: border-box;
		z-index: 20;
		transform: translateY(-50%);

	}
	.new-entry .txt:after{
		content: "";
		position: absolute;
		top: 50%;
		right: -15px;
		margin-top: -100vw;
		display: block;
		width: 200vw;
		height: 200vw;
		background: #042666;
		z-index: 10;
		transform-origin: right center;
		transform: rotate(-45deg);
	}


	.new-entry .txt-inner{
		position: relative;
		padding: 25px 50px 25px 35px;
		z-index: 20;
	}
	.new-entry .txt .date{
		display: block;
		color: #fff;
		font-weight: 500;
	}
	.new-entry .txt .label{
		display: inline-block;
		margin-top: 10px;
		padding: 2px 10px;
		color: #042666;
		background: #fff;
	}
	.new-entry .txt .sub{
		display: block;
		margin-top: 20px;
		font-size: 20px;
		color: #fff;
		font-weight: 500;
	}
	.new-entry .txt h4{
		margin-top: 15px;
		color: #af9340;
		font-weight: 500;
	}
	.new-entry .txt h4 strong{
		font-size: 45px;
		display: block;
		line-height: 1.3;
	}
	.new-entry .txt h4 span{
		display: inline-block;
		margin-top: 15px;
		font-size: 24px;
	}
	.new-entry .txt p{
		margin-top: 10px;
		color: #fff;
	}
	.new-entry figure{
		position: relative;
		height: 100%;
		width: auto;
		text-align: right;
	}
	.new-entry figure img{
		position: absolute;
		right: 0;
		height: 100%;
		width: auto;
	}
	.new-entry a:hover{
		opacity: 0.7;
		transition: opacity 300ms ease;
	}
	.latest-entry{
		margin-top: 60px;
	}



	/* entry-list
	------------------------------------------------------------*/

	.entry-wrap{
		display: flex;
		flex-wrap: wrap;
		margin: 0 -15px;
	}
	.entry-wrap .entry-list{
		width: calc(100% / 3);
		padding: 0 15px;
		box-sizing: border-box;
	}
	.entry-wrap .entry-list:nth-child(n+4){
		margin-top: 60px;
	}
	.entry-wrap .entry-list a{
		display: block;
	}
	.entry-wrap .entry-list a:hover{
		opacity: 0.7;
		transition: opacity 300ms ease;
	}
	.entry-wrap .entry-list .label{
		position: absolute;
		top: 0;
		left: 0;
		display: inline-block;
		padding: 2px 10px;
		color: #fff;
		font-size: 18px;
		background: #042666;
	}
	.entry-wrap .entry-list figure{
		position: relative;
		margin-top: 10px;
	}
	.entry-wrap .entry-list figure:after{
		content: "";
		position: absolute;
		bottom: 0;
		right: 0;
		display: block;
		width: 30px;
		height: 30px;
		background: #d51322 url(/shared/img/arrow_wh_r.png) 50% 50% no-repeat;
		background-size: 10px 16px;
		z-index: 10;
	}
	.entry-wrap .entry-list figure img{
		width: 100%;
		height: auto;
	}
	.entry-wrap .entry-list h4{
		margin-top: 20px;
		padding: 0 0 0 10px;
		font-weight: 500;
		color: #042666;
		border-left: 7px solid #042666;
	}
	.entry-wrap .entry-list h4 strong{
		font-size: 22px;
		display: block;
		line-height: 1.5;
	}
	.entry-wrap .entry-list h4 span{
		margin-top: 10px;
		display: inline-block;
		font-size: 16px;
	}
	.entry-wrap .entry-list p{
		margin-top: 15px;
		display: -webkit-box;
		overflow: hidden;
		-webkit-line-clamp: 2;
		-webkit-box-orient: vertical;
	}


	/* post-voice
	------------------------------------------------------------*/

	#post-voice .sec-entry-header{
		position: relative;
		overflow: hidden;
	}
	#post-voice .post-entry-header figure{
		width: 100%;
		height: auto;
		overflow: hidden;
	}
	#post-voice .post-entry-header figure img{
		width: 100%;
		height: auto;
	}
	#post-voice .latest-post{
		margin-top: 30px;
	}
	#post-voice .latest-post + .post-entry-header{
		margin-top: 90px;
	}
	#post-voice .note{
		margin-top: 30px;
		text-align: center;
	}
	#post-voice .post-container{
		margin-top: 30px;	
	}

	#post-voice .post-wrap{
		display: flex;
		flex-wrap: wrap;
		margin: 0 -15px;
	}
	#post-voice .post-list-index .post-wrap{
		display: block;
	}

	#post-voice .post-wrap .post-list{
		width: calc(100% / 3);
		padding: 0 15px;
		margin-bottom: 30px;
		box-sizing: border-box;
		z-index: 50;
	}
	#post-voice .post-wrap .post-list ul{
		margin-top: 20px;
	}
	#post-voice .post-wrap .post-list ul li{
		display: inline-block;
		margin-right: 20px;
		font-weight: 700;
		color: #042666;
	}

	#post-voice .post-wrap .post-list > a{
		position: relative;
		display: block;
		padding: 30px;
		border: 4px solid #042666;
		width: 100%;
		height: 100%;
		box-sizing: border-box;
		background: #fff;
	}

	#post-voice .post-wrap .post-list > a:hover{
		opacity: 0.7;
		transition: opacity 300ms ease;
	}
	
	#post-voice .post-wrap .post-list > a:after{
		content: "";
		position: absolute;
		margin: auto;
		bottom: -23px;
		left: 0;
		right: 0;
		width: 25px;
		height: 23px;
		background: url(/value/shared/img/baloon_bottom.png) 50% 50% no-repeat;
		background-size: 100% 100%;
		z-index: 10;
	}

	/* ownly
	------------------------------------------------------------*/

	#voices .post-wrap .ownlyUgcsetPost{
		position: relative;
		width: calc((100% / 3) - 30px) !important;
		display: inline-block;
		margin: 0 15px 30px;
		padding: 30px !important;
		border: 4px solid #042666;
		background: #fff;
		box-sizing: border-box;
	}
	#voices .post-wrap .ownlyUgcsetPost:after{
		content: "";
		position: absolute;
		margin: auto;
		bottom: -23px;
		left: 0;
		right: 0;
		width: 25px;
		height: 23px;
		background: url(/value/shared/img/baloon_bottom.png) 50% 50% no-repeat;
		background-size: 100% 100%;
		z-index: 10;
	}

	#voices .post-wrap .ownlyUgcWidget_block .ownlyUgcsetPostPhoto {
		width: 100% !important;
		height: 200px;
		position: relative;
		text-align: center;
	}
	#voices .post-wrap img.ownlyPostImage{
		width: 100% !important;
		max-width: 200px !important;
	}
	#voices .post-wrap .ownlyUgcSlide,
	#voices .post-wrap .ownlySlideListItem{
		width: 100% !important;
		max-width: 200px !important;		
	}
	#voices .post-wrap .ownlyUgcWidget_block .ownlyUgcsetPostPhotoImg, .ownlyUgcWidget_block .ownlyUgcsetPostVideo video{
			width: 100% !important;
			max-width: 200px !important;		
	}
	#voices .post-wrap .ownlyUgcWidget_block .ownlyUgcsetPostText {
		margin: 2px;
		font-size: 16px !important;
		overflow: hidden;
	}
	#voices .post-wrap .ownlyUgcWidget_block .ownlyUgc *, .ownlyUgcWidget_block .ownlyUgcUL *{
		color: #042666 !important;
	}


	#voices .post-wrap .ownlyUgcPagination{
		position: relative;
		display: block;
		margin: 0 auto;
		width: 515px;
		height: auto;
	}
	#voices .post-wrap .ownlyUgcPagination .ugcPaging{
		margin: 60px auto 0;
		padding: 0;
		width: 515px;
		height: 63px;
		position: relative;
		display: block;
		line-height: 63px;
		text-align: center;
		color: #fff;
		border: none;
		font-size: 0;
		background-color: #d51322;
		z-index: 50;
	}
	#voices .post-wrap .ownlyUgcPagination .ugcPaging:before{
		content: "もっと見る";
		font-size: 18px;
	}
	#voices .post-wrap .ownlyUgcPagination .ugcPaging:after{
		content: "";
		position: absolute;
		margin: auto;
		top: 0;
		right: 30px;
		bottom: 0;
		width: 10px;
		height: 16px;
		background: url(/shared/img/arrow_wh_btn.png) 50% 50% no-repeat;
		background-size: 100% 100%;
	}



	/* symposium-list
	------------------------------------------------------------*/

	.symposium-wrap{
		display: flex;
		flex-wrap: wrap;
		margin: 0 -15px;
	}
	.symposium-wrap .symposium-list{
		width: calc(100% / 3);
		padding: 0 15px;
		box-sizing: border-box;
	}
	.symposium-wrap .symposium-list a{
		display: block;
	}
	.symposium-wrap .symposium-list a:hover{
		opacity: 0.7;
		transition: opacity 300ms ease;
	}
	.symposium-wrap .symposium-list figure{
		position: relative;
		margin-top: 10px;
	}
	.symposium-wrap .symposium-list figure img{
		width: 100%;
		height: auto;
	}
	.symposium-wrap .symposium-list h3{
		margin-top: 20px;
	}
	.symposium-wrap .symposium-list .label{
		display: inline-block;
		margin-top: 20px;
		font-size: 20px;
		font-weight: 700;
		color: #042666;
	}



}


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

	.value-header-inner{
		margin: 0 -150px;
	}


}




@media screen and (min-width: 801px) and (max-width: 980px) {

	#value main article{
		padding: 60px 20px;
	}
	.entry-wrap{
		margin: 0 -10px;
	}
	.entry-wrap .entry-list{
		padding: 0 10px;
	}
	#post-voice .post-wrap{
		margin: 0 -10px;
	}
	#post-voice .post-wrap .post-list{
		padding: 0 10px;
	}
	#post-voice .post-wrap .post-list > a{
		padding: 15px;
	}
	.symposium-wrap{
		margin: 0 -10px;
	}
	.symposium-wrap .symposium-list{
		padding: 0 10px;
	}



}







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


	#value .intro{
		padding-bottom: 40px;
	}
	#value .intro p{
		line-height: 1.8;
	}


	#value .section-header span:before,
	#value .section-header span:after {
		width: calc(50% - 55px);
	}
	#symposium .section-header span:before,
	#symposium .section-header span:after {
		width: calc(50% - 32px);
	}

	#value article{
		padding: 35px 20px;
	}

	#voices .btn-more{
		margin-top: 20px;
	}
	#symposium .btn-more{
		margin-top: 20px;
	}

	.sec-title + div{
		margin-top: 30px;
	}
	.sec-inner + .sec-inner{
		margin-top: 60px;
	}

	.value-header-inner{
		margin-left: calc(-50vw + 50%);
		margin-right: calc(-50vw + 50%);
	}
	.value-header-inner img{
		width: 100%;
	}




	/* new-entry
	------------------------------------------------------------*/

	.new-entry{
		position: relative;
		overflow: hidden;
	}
	.new-entry-inner{
		position: relative;
		width: 610px;
		height: 450px;
		transform-origin: top left;
	}
	.new-entry a{
		position: relative;
		display: block;
	}
	.new-entry a:after{
		content: "";
		position: absolute;
		top: 50%;
		right: 0;
		display: block;
		width: 30px;
		height: 30px;
		background: #d51322 url(/shared/img/arrow_wh_r.png) 50% 50% no-repeat;
		background-size: 10px 16px;
		z-index: 30;
	}
	.new-entry .txt{
		position: absolute;
		top: 50%;
		left: 0;
		display: inline-block;
		box-sizing: border-box;
		z-index: 20;
		transform: translateY(-50%);

	}
	.new-entry .txt:after{
		content: "";
		position: absolute;
		top: 50%;
		right: -30px;
		margin-top: -100vh;
		display: block;
		width: 200vh;
		height: 200vh;
		background: #042666;
		z-index: 10;
		transform-origin: right center;
		transform: rotate(-45deg);
	}


	.new-entry .txt-inner{
		position: relative;
		padding: 25px 15px 25px 20px;
		z-index: 20;
	}
	.new-entry .txt .date{
		display: block;
		color: #fff;
		font-size: 24px;
		font-weight: 700;
	}
	.new-entry .txt .label{
		display: inline-block;
		margin-top: 20px;
		padding: 2px 10px;
		font-size: 24px;
		color: #042666;
		background: #fff;
	}
	.new-entry .txt .sub{
		display: block;
		margin-top: 20px;
		font-size: 24px;
		color: #fff;
		font-weight: 500;
	}
	.new-entry .txt h4{
		margin-top: 15px;
		color: #af9340;
		font-weight: 500;
	}
	.new-entry .txt h4 strong{
		font-size: 42px;
		display: block;
		line-height: 1.3;
	}
	.new-entry .txt h4 span{
		display: inline-block;
		margin-top: 15px;
		font-size: 26px;
	}
	.new-entry .txt p{
		margin-top: 10px;
		color: #fff;
	}
	.new-entry figure{
		position: relative;
		height: 100%;
		width: auto;
		text-align: right;
	}
	.new-entry figure img{
		position: absolute;
		right: 0;
		height: 100%;
		width: auto;
	}
	.new-entry a:hover{
		opacity: 0.7;
		transition: opacity 300ms ease;
	}
	.latest-entry{
		margin-top: 60px;
	}

	.swiper-container{
		padding: 0 30px 0 0;		
	}
	.swiper-wrapper{
		margin: 0 -11px;
	}
	.swiper-wrapper .swiper-slide{
		width: calc(100% / 3);
		padding: 0 11px;
		box-sizing: border-box;		
	}



	/* entry-list
	------------------------------------------------------------*/


	.entry-wrap .entry-list a{
		display: block;
	}
	.entry-wrap .entry-list .label{
		position: absolute;
		top: 0;
		left: 0;
		display: inline-block;
		padding: 0 10px;
		height: 28px;
		line-height: 28px;
		color: #fff;
		font-size: 13px;
		background: #042666;
	}
	.entry-wrap .entry-list figure{
		position: relative;
		margin-top: 10px;
	}
	.entry-wrap .entry-list figure:after{
		content: "";
		position: absolute;
		bottom: 0;
		right: 0;
		display: block;
		width: 23px;
		height: 23px;
		background: #d51322 url(/shared/img/arrow_wh_r.png) 50% 50% no-repeat;
		background-size: 8px 12px;
		z-index: 10;
	}
	.entry-wrap .entry-list figure img{
		width: 100%;
		height: auto;
	}
	.entry-wrap .entry-list h4{
		margin-top: 20px;
		padding: 0 0 0 10px;
		font-weight: 500;
		color: #042666;
		border-left: 6px solid #042666;
	}
	.entry-wrap .entry-list h4 strong{
		font-size: 18px;
		display: block;
		line-height: 1.5;
	}
	.entry-wrap .entry-list h4 span{
		margin-top: 10px;
		display: inline-block;
		font-size: 13px;
	}
	.entry-wrap .entry-list p{
		margin-top: 15px;
		display: -webkit-box;
		overflow: hidden;
		-webkit-line-clamp: 2;
		-webkit-box-orient: vertical;
	}


	.entry-list-index .entry-wrap{
		display: flex;
		flex-wrap: wrap;
		margin: 0 -6px;
	}
	.entry-list-index .entry-wrap .entry-list{
		width: calc(100% / 2);
		padding: 0 6px;
		box-sizing: border-box;
	}
	.entry-list-index .entry-wrap .entry-list:nth-child(n+3){
		margin-top: 25px;
	}
	.entry-list-index .entry-wrap .entry-list h4{
		margin-top: 10px;
		border-left: 4px solid #042666;
	}
	.entry-list-index .entry-wrap .entry-list h4 strong{
		font-size: 16px;
	}
	.entry-list-index .entry-wrap .entry-list h4 span{
		font-size: 10px;
	}
	.entry-list-index .entry-wrap .entry-list p{
		margin-top: 10px;
		display: -webkit-box;
		overflow: hidden;
		-webkit-line-clamp: 2;
		-webkit-box-orient: vertical;		
	}
	.entry-list-index .entry-wrap .entry-list .label{
		font-size: 10px;
		padding: 0 5px;
		height: 18px;
		line-height: 18px;
	}
	.entry-list-index .entry-wrap .entry-list .list-date{
		font-size: 10px;
	}
	.entry-list-index .entry-wrap .entry-list figure {
	    position: relative;
	    margin-top: 8px;
	}


	/* post-voice
	------------------------------------------------------------*/

	#post-voice .post-entry-header{
		position: relative;
		overflow: hidden;
	}
	#post-voice .post-entry-header figure img{
		width: 100%;
		height: auto;
	}
	#post-voice .latest-post{
		margin-top: 30px;
	}
	#post-voice .latest-post + .post-entry-header{
		margin-top: 40px;
	}
	#post-voice .note{
		margin-top: 20px;
		text-align: left;
		text-indent: -1em;
		padding-left: 1em;
	}


	#post-voice .post-container{
		margin-top: 30px;	
	}


	#post-voice .post-wrap .post-list ul{
		margin-top: 20px;
	}
	#post-voice .post-wrap .post-list ul li{
		display: inline-block;
		margin-right: 20px;
		font-weight: 700;
		color: #042666;
	}

	#post-voice .post-wrap .post-list > a{
		position: relative;
		display: block;
		padding: 25px;
		border: 2px solid #042666;
		width: 100%;
		height: 100%;
		box-sizing: border-box;
		background: #fff;		

	}
	#post-voice .post-wrap .post-list > a:after{
		content: "";
		position: absolute;
		margin: auto;
		bottom: -11px;
		left: 0;
		right: 0;
		width: 12px;
		height: 11px;
		background: url(/value/shared/img/baloon_bottom.png) 50% 50% no-repeat;
		background-size: 100% 100%;
		z-index: 10;
	}


	.post-list-index .post-wrap .post-list{
		width: 100%;
		box-sizing: border-box;
	}
	.post-list-index .post-wrap .post-list + .post-list{
		margin-top: 25px;
	}
	.post-list-index .post-wrap .post-list h4{
		margin-top: 10px;
		border-left: 4px solid #042666;
	}
	.post-list-index .post-wrap .post-list h4 strong{
		font-size: 16px;
	}
	.post-list-index .post-wrap .post-list h4 span{
		font-size: 10px;
	}





	/* ownly
	------------------------------------------------------------*/


	#post-voice .swiper-container{
		padding: 0 52px 0 0;
		overflow: inherit;
	}


	#post-voice .post-wrap .ownlyUgcsetPost{
		position: relative;
		width: 100% !important;
		display: block;
		margin: 0 0 30px;
		padding: 25px !important;
		border: 2px solid #042666;
		background: #fff;
		box-sizing: border-box;
	}
	#post-voice .post-wrap .ownlyUgcsetPost.swiper-slide{
		margin: 0 0 12px;
	}



	#post-voice .post-wrap .ownlyUgcsetPost:after{
		content: "";
		position: absolute;
		margin: auto;
		bottom: -11px;
		left: 0;
		right: 0;
		width: 12px;
		height: 11px;
		background: url(/value/shared/img/baloon_bottom.png) 50% 50% no-repeat;
		background-size: 100% 100%;
		z-index: 10;
	}
	#post-voice .post-wrap .ownlyUgcWidget_block .ownlyUgc{
		margin: 0 !important;
	}
	#post-voice .post-wrap .ownlyUgcWidget_block .ownlyUgcsetPostPhoto {
		width: 100% !important;
		height: 200px;
		position: relative;
		text-align: center;
	}
	#post-voice .post-wrap img.ownlyPostImage{
		width: 100% !important;
		max-width: 200px !important;
	}
	#post-voice .post-wrap .ownlyUgcSlide,
	#post-voice .post-wrap .ownlySlideListItem{
		width: 100% !important;
		max-width: 200px !important;		
	}
	#post-voice .post-wrap .ownlyUgcWidget_block .ownlyUgcsetPostPhotoImg, .ownlyUgcWidget_block .ownlyUgcsetPostVideo video{
		width: 100% !important;
		max-width: 200px !important;		
	}
	#post-voice .post-wrap .ownlyUgcWidget_block .ownlyUgcsetPostText {
		margin: 2px;
		height: auto !important;
		overflow: hidden;
	}
	#post-voice .post-wrap .ownlyUgcWidget_block .ownlyUgc *, .ownlyUgcWidget_block .ownlyUgcUL *{
		color: #042666 !important;
	}

	#post-voice .post-wrap .ownlyUgcPagination{
		margin: 0 auto 0;
		width: 100%;
		height: auto;
	}
	#post-voice .post-wrap .ownlyUgcPagination .ugcPaging{
		padding: 0;
		margin: 20px auto 0;
		width: 100%;
		height: 45px;
		position: relative;
		display: block;
		line-height: 45px;
		text-align: center;
		color: #fff;
		border: none;
		font-size: 0;
		background-color: #d51322;
		z-index: 50;
	}
	#post-voice .post-wrap .ownlyUgcPagination .ugcPaging:before{
		content: "もっと見る";
		font-size: 13px;
	}
	#post-voice .post-wrap .ownlyUgcPagination .ugcPaging:after{
		content: "";
		position: absolute;
		margin: auto;
		top: 0;
		right: 15px;
		bottom: 0;
		width: 8px;
		height: 12px;
		background: url(/shared/img/arrow_wh_btn.png) 50% 50% no-repeat;
		background-size: 100% 100%;
	}




	/* symposium-list
	------------------------------------------------------------*/


	.symposium-wrap .symposium-list a{
		display: block;
	}
	.symposium-wrap .symposium-list figure{
		position: relative;
		margin-top: 10px;
	}
	.symposium-wrap .symposium-list figure img{
		width: 100%;
		height: auto;
	}
	.symposium-wrap .symposium-list h3{
		margin-top: 20px;
	}
	.symposium-wrap .symposium-list .label{
		display: inline-block;
		margin-top: 10px;
		font-size: 14px;
		font-weight: 700;
		color: #042666;
	}






}