@charset "utf-8";
/* -----------------------------------------------------------------------------

	共通

----------------------------------------------------------------------------- */
@import url('https://fonts.googleapis.com/css?family=Mada');
@import url('https://fonts.googleapis.com/css?family=Asap');
#contents_block  .contents {
	text-align: left;
	position: relative;
	line-height: 1.5;
	overflow: hidden;
	font-family: 'Noto Sans Japanese', sans-serif;
}
/* -----------------------------------------------------------------------------

	PC

----------------------------------------------------------------------------- */
@media print, screen and (min-width: 641px) {
	#contents_block  .contents {
		text-align: left;
		-webkit-font-smoothing:antialiased;
	}
	#contents_block  .contents .inner {
		width: 96%;
		max-width: 980px;
		margin: 0 auto;
		position: relative;
	}
	#contents_block  .contents .sp {
		display: none!important;
	}
	
	/*btnType01*/
	#contents_block .contents .btnType01 a{
		display: block;
		padding: 20px 0;
		border: 2px solid #444;
		text-align: center;
		background-position: 95% center;
		background-repeat:no-repeat;
		background-size: 26px auto;
		background-image: url(../img/arrow.svg);
		font-size: 1.6rem;
		color: #22252c;
		-webkit-transition: color .3s ease-in-out,border .3s ease-in-out;
		transition: color .3s ease-in-out,border .3s ease-in-out;
		background-color: transparent!important;
		z-index:10;
		overflow: hidden;
	}
	/*white*/
	#contents_block .contents .btnType01.white a {
		color: #fff;
		border-color: #fff;
		background-image: url(../img/arrow_w.svg);
		background-size: 26px auto;
	}
	#contents_block .contents .btnType01 a:hover {
		border: 2px solid transparent;
	 	color: #fff!important;
	 	background: url(../img/arrow_w.svg) no-repeat 95% center;
		background-size: 26px auto;
	}
	#contents_block .contents .btnType01 a::before {
		content: '';
		width: 0%;
		height: 100%;
		display: block;
		background: #e60012;
		position: absolute;
		-webkit-transform: skewX(-20deg);
		transform: skewX(-20deg);
		left: -10%;
		opacity: 1;
		top: 0;
		z-index: -12;
		-webkit-transition: all .7s cubic-bezier(0.77, 0, 0.175, 1);
		transition: all .7s cubic-bezier(0.77, 0, 0.175, 1);
	}
	#contents_block .contents .btnType01.white a::before {
		background: #054096;
	}
	#contents_block .contents .btnType01 a::after {
		content: '';
		width: 0%;
		height: 100%;
		display: block;
		background: #000;
		position: absolute;
		-ms-transform: skewX(-20deg);
		-webkit-transform: skewX(-20deg);
		transform: skewX(-20deg);
		left: -10%;
		opacity: 0;
		top: 0;
		z-index: -15;
		-webkit-transition: all .94s cubic-bezier(.2,.95,.57,.99);
		-moz-transition: all .4s cubic-bezier(.2,.95,.57,.99);
		-o-transition: all .4s cubic-bezier(.2,.95,.57,.99);
		transition: all .4s cubic-bezier(.2,.95,.57,.99);
	}
	#contents_block .contents .btnType01.white a::after {
		background: #fff;
	}
	#contents_block .contents .btnType01 a:hover::before,
	#contents_block .contents .btnType01 a:hover::after {
		opacity:1;
		width: 116%;
	}
	#contents_block .contents .btnType01 a:hover::after,
	#contents_block .contents .btnType01 a:hover::before {
		opacity:1;
		width: 126%;
	}
	#contents_block .contents .btnType01 a span {
		padding-right:15px;
		position: relative;
		z-index: 3;
	}
	
	/* .share
	------------------------------------------------------------------*/
	#contents_block .contents #follow .share {
		text-align: center;
		margin: 120px auto 0;
	}
	#contents_block .contents #follow .share .logoTxt {
		text-align:center;
		margin-bottom:  20px;
	}
	
	#contents_block .contents #follow .share dl {
		text-align: center;
	}
	#contents_block .contents #follow .share dl dt {
		display: inline-block;
		vertical-align: middle;
	}
	#contents_block .contents #follow .share dl dd {
		display: inline-block;
		margin-left: 10px;
		vertical-align: middle;
		line-height: 0;
	}
	#contents_block .contents #follow .share dl dd a {
		display: block;
		width: 50px;
		height: 50px;
		position: relative;
		transition:0.3s ease-in-out;
		border:2px solid transparent;
		box-sizing:border-box;
	}
	/*hover*/
	#contents_block .contents #follow .share dl dd a:hover {
		opacity:0.7;
	}

	#contents_block .contents #follow .share .pht01 {
		top: 50px;
		left: 50%;
		margin-left: -710px;
		position: absolute;
	}
	#contents_block .contents #follow .share .pht02 {
		top: 50px;
		right: 50%;
		margin-right: -650px;
		position: absolute;
	}
	
	/* #official
	------------------------------------------------------------------*/
	#contents_block .contents .official {
		position: absolute;
		right: 0;
		top: 30px;
		width: 45px;
		padding: 15px 0;
		background: #fff;
		border-radius: 10px 0 0 10px;
		text-align: center;
		z-index: 100;
		box-shadow: 0px 0px 5px 0px #4c4c4c47;
	}
	#contents_block .contents .official.fixed {
		position: fixed;
		top: 30px;
	}
	#contents_block .contents .official dt {
		position: relative;
		margin-bottom: 35px;
	}
	#contents_block .contents .official dt:after {
		content: "";
		width: 1px;
		height: 18px;
		background: #000;
		position: absolute;
		bottom: -24px;
		left: 50%;
	}
	#contents_block .contents .official dd {
		margin: 0 auto;
	}
	#contents_block .contents .official dd  a {
		display:block;
		transition: 0.3s;
	}
	#contents_block .contents .official dd.insta {
		width: 23px;
	}
	#contents_block .contents .official dd.twitter {
		width: 24px;
		margin-top: 13px;
	}
	#contents_block .contents .official dd  a:hover {
		opacity: 0.7;
	}
	
	/* 下層共通
	------------------------------------------------------------------*/
	#contents_block .contents.lower {
		background: #f6f6f6;
	}
	/* lowerTtl
	------------------------------------------------------------------*/
	#contents_block .contents.lower .lowerTtl {
		text-align: center;
		padding-top: 95px;
		position: relative;
		z-index: 1;
	}
	#contents_block .contents.lower .lowerTtl h2 {
		font-size: 2.0rem;
		position: relative;
		z-index: 2;
	}
	#contents_block .contents.lower .lowerTtl h2 b {
		font-family: 'Mada', sans-serif;
		font-weight: bold;
		font-size: 4.8rem;
		letter-spacing: 0.1em;
		display: block;
		margin-bottom: 10px;
		line-height: 1;
	}
	#contents_block .contents.lower .lowerTtl .obj01 {
		position: absolute;
		top: 0;
		left: 0;
		z-index: 1;
	}
	#contents_block .contents.lower .lowerTtl .obj02 {
		position: absolute;
		top: 0;
		right: 0;
		z-index: 1;
	}
	
	/* #pickup
	------------------------------------------------------------------*/
	#contents_block .contents.lower #pickup {
		background: #fff;
		overflow: hidden;
		position: relative;
	}
	#contents_block .contents.lower #pickup .inner {
		padding: 125px 0 230px;
		}
	#contents_block .contents.lower #pickup .secTtl {
		text-align: center;
		font-size: 4.3rem;
		font-family:'Mada', sans-serif;
		margin-bottom: 30px;
		color: #e60012;
		letter-spacing: 0.05em;
	}
	#contents_block .contents.lower #pickup .bnr {
		width: 48%;
		line-height: 1;
	}
	#contents_block .contents.lower #pickup .bnr a {
		display: block;
		position: relative;
	}
	#contents_block .contents.lower #pickup .bnr a:before {
		content: '';
		position: absolute;
		border: #faf7f0 solid 2px;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
		transition:0.2s ease-in-out;
	}#contents_block .contents.lower #pickup .bnr a:hover:before {
		top: -4px;
		right: -4px;
		bottom: -4px;
		left: -4px;
		border-color: #e60012;
	}
	#contents_block .contents.lower #pickup .bnr img {
		width: 100%;
		max-width: 470px;
	}
	#contents_block .contents.lower #pickup .bnr:first-child {
		float: left;
	}
	#contents_block .contents.lower #pickup .bnr:first-child + .bnr {
		float: right;
	}
	#contents_block .contents.lower #pickup .bnr a {
		position: relative;
		display: block;
	}
	#contents_block .contents.lower #pickup .obj {
		top: -105px;
		right: 0;
		position: absolute;
	}
	
	
	/* #follow
	------------------------------------------------------------------*/
	#contents_block .contents.lower #follow {
		position: relative;
		background:#fff;
		padding: 60px 0 120px;
	}
	#contents_block .contents.lower #follow .secTtl {
		color: #fff;
		position: relative;
		z-index: 3;
	}
	#contents_block .contents.lower #follow .ttl{
		position: relative;
		text-align:center;
		overflow: hidden;
		height: 55px;
		z-index: 3;
	}
	
	#contents_block .contents.lower #follow .ttl .secTtl {
		color: #fff;
		z-index: 3;
		font-size: 3.6rem;
		font-family:'Mada', sans-serif;
		display: inline-block;
		vertical-align: top;
		letter-spacing: 0.1em;
	}
	#contents_block .contents.lower #follow .instaPost p {
		text-align: center;
		font-size: 2.0rem;
		margin: 40px auto 20px;
		color:#fff;
		line-height: 1;
	}
	#contents_block .contents.lower #follow .instaPost span.txt {
		padding-top: 1px;
		display: inline-block;
	}
	#contents_block .contents.lower #follow .instaPost p .icon {
		display: inline-block;
		width: 22px;
		margin-right: 10px;
		height: 24px;
		vertical-align: middle;
		margin-top: -4px;
	}
	/*iconBtn*/
	#contents_block .contents.lower #follow .iconBtn {
		display: inline-block;
		margin-left:  30px;
		vertical-align: top;
		position: relative;
	}
	#contents_block .contents.lower #follow .iconBtn .btn {
		width: 50px;
		height: 50px;
		float: left;
	}
	#contents_block .contents.lower #follow .iconBtn .btn a {
		display: block;
		color: #fff;
		height: 50px;
		border:1px solid #fff;
		position: relative;
		-webkit-transition: all .3s ease-in-out;
		transition: all .3s ease-in-out;
	}
	#contents_block .contents.lower #follow .iconBtn .btn.twitter a {
		border-left:0;
	}
	#contents_block .contents.lower #follow .iconBtn .btn span {
		position: absolute;
		top: 50%;
		left: 50%;
		display: block;
		transform: translate(-50%,-50%);
	}
	#contents_block .contents.lower #follow .iconBtn .btn.insta span {
		width: 23px;
		height: 22px;
	}
	#contents_block .contents.lower #follow .iconBtn .btn.twitter span {
		width: 28px;
		height: 22px;
	}
	#contents_block .contents.lower #follow .iconBtn .btn span svg {
		width:100%;
	}
	
	/*hover*/
	#contents_block .contents.lower #follow .iconBtn .btn.insta a:hover {
		background: #D62575;
	}
	#contents_block .contents.lower #follow .iconBtn .btn.twitter a:hover {
		background: #21A1F0;
	}
	
	/*instaPost*/
	#contents_block .contents.lower #follow .instaPost {
		position: relative;
		z-index: 3;
	}
	#contents_block .contents.lower #follow .instaPost .postSlider #instafeed {
		overflow: visible;
		width: 100%;
		height: 150px;
		margin: 0 auto;
	}
	#contents_block .contents.lower #follow .instaPost .postSlider #instafeed .slick-slide {
		width: 160px;
		height: 150px;
		float: left;
	}
	#contents_block .contents.lower #follow .instaPost .postSlider #instafeed div span {
		display: block;
		width: 150px;
		height: 150px;
		position: relative;
		margin-left: 10px;
		overflow: hidden;
	}
	#contents_block .contents.lower #follow .instaPost .postSlider #instafeed div span:before {
		content: "";
		width: 150px;
		height: 150px;
		background: rgba(0,64,152,0.5);
		position: absolute;
		top: 0;
		left: 0;
		z-index: 2;
		opacity: 0;
		transition: 0.3s ease;
	}
	#contents_block .contents.lower #follow .instaPost .postSlider #instafeed div span:after {
		content: "";
		width: 30px;
		height: 30px;
		background: url(../img/blank.svg) no-repeat 0 0;
		background-size: 98%;
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%,-50%);
		z-index: 3;
		opacity: 0;
		transition: 0.3s ease;
	}
	#contents_block .contents.lower #follow .instaPost .postSlider #instafeed div a:hover span:before,
	#contents_block .contents.lower #follow .instaPost .postSlider #instafeed div a:hover span:after {
		opacity: 1;
	}
	#contents_block .contents.lower #follow .instaPost .postSlider #instafeed div span img.square,
	#contents_block .contents.lower #follow .instaPost .postSlider #instafeed div span img.tall{
		width: 100%;
		height: auto;
	}
	#contents_block .contents.lower #follow .instaPost .postSlider #instafeed div span img.wide {
		height: 100%;
		width: auto;
	}
	#contents_block .contents.lower #follow .instaPost .postSlider #instafeed div span img {
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%,-50%);
	}
	#contents_block .contents.lower #follow .bg {
		height:315px;
		width: 3000px;
		background: #fff;
		position: absolute;
		z-index: 2;
		top: 0;
		left: 50%;
		margin-left: -1500px;
		transform: rotate(-10deg);
		overflow: hidden;
	}
	#contents_block .contents.lower #follow .bg:after {
		position:absolute;
		content:"";
		height: 315px;
		width: 0;
		top:0;
		left:0;
		left: 50%;
		margin-left: -1500px;
		overflow: hidden;
		background: #e60012;
		z-index: 1;
		transition: 1.0s cubic-bezier(0.19, 1, 0.22, 1);;
	}
	#contents_block .contents.lower #follow .bg.animate:after {
		width: 3000px;
	}
	#contents_block .contents.lower #follow .obj{
		position: absolute;
	}
	#contents_block .contents.lower #follow .obj01 {
		left: 0;
		top: -110px;
	}
	#contents_block .contents.lower #follow .obj02{
		right: 0;
		top: 170px;
		z-index: 1;
	}
	#contents_block .contents.lower #follow .pagetop {
		position: absolute;
		width: 62px;
		height: 37px;
		bottom: 15px;
		right: 50px;
		cursor: pointer;
		transition: 0.3s ease;
		background: #fff;
		background: url(../img/pagetop_o.png) no-repeat 0 0;
	}
	#contents_block .contents.lower #follow .pagetop img {
		width: 62px;
		height: 37px;
		transition: 0.3s ease;
		background: #fff;
	}
	#contents_block .contents.lower #follow .pagetop:hover img {
		opacity: 0;
	}
	
}
/*調整*/
@media print, screen and (min-width: 641px) and (max-width: 1400px) {
	
	/*あしらい固定*/
	#contents_block .contents.lower .lowerTtl .obj01 {
		left: 50%;
		margin-left: -690px;
	}
	#contents_block .contents.lower .lowerTtl .obj02 {
		right: 50%;
		margin-right: -690px;
	}
	
}
@media print, screen and (min-width: 641px) and (max-width: 980px) {
	
	/*あしらい固定*/
	#contents_block .contents.lower #pickup .obj {
		right: 50%;
		margin-right: -480px;
	}
	#contents_block .contents.lower #follow .obj01 {
		left: 50%;
		margin-left: -482px;
	}
	#contents_block .contents.lower #follow .obj02 {
		right: 50%;
		margin-right: -480px;
	}
}
/* IE */
@media all and (-ms-high-contrast: none){
	#contents_block .contents .btnType01 a {
		background-size: 31px auto!important;
	}
	#contents_block .contents.lower #follow .instaPost .postSlider #instafeed div span:after{
		width: 33px;
		height: 33px;
		background-size: 98%!important;
		backface-visibility: hidden;
	}
}
/* -----------------------------------------------------------------------------

	SP

----------------------------------------------------------------------------- */
@media print, screen and (max-width: 640px) {
	#contents_block  .contents .inner {
		padding: 0 10px;
		position: relative;
	}
	#contents_block  .contents img {
		width: 100%;
		height: auto;
	}
	#contents_block  .contents .sp {
		display: block;
	}
	#contents_block  .contents .pc {
		display: none!important;
	}
	/*btnType01*/
	#contents_block .contents .btnType01 a{
		display: block;
		padding: 15px 0;
		border: 2px solid #444;
		text-align: center;
		background: url(../img/arrow.svg) no-repeat 95% center;
		background-size: 20px auto;
		font-size: 1.4rem;
		color: #22252c;
	}
	#contents_block .contents .btnType01 a span {
		padding-right:15px;
	}
	/*white*/
	#contents_block .contents .btnType01.white a {
		color: #fff;
		border-color: #fff;
		background: url(../img/arrow_w.svg) no-repeat 95% center;
		background-size: 20px auto;
	}
	
	/* .share
	------------------------------------------------------------------*/
	#contents_block .contents #follow .share {
		text-align: center;
		margin: 100px auto 0;
		margin: 15vh auto 0;
	}
	#contents_block .contents #follow .share .logoTxt {
		width:47.5%;
		margin:15px auto 0;
	}
	#contents_block .contents #follow .share dl {
		text-align: center;
		margin: 20px auto 30px;
		width: 80%;
	}
	#contents_block .contents #follow .share dl dt {
		width: 23%;
		display: inline-block;
		vertical-align: middle;
	}
	#contents_block .contents #follow .share dl dd {
		margin-left: 15px;
		width: 14%;
		display: inline-block;
		vertical-align: middle;
		line-height: 0;
	}
	#contents_block .contents #follow .share .pht01,
	#contents_block .contents #follow .share .pht02{
		width: 102%;
		margin: 0 0 0 -1%;
	}
	
	/* 下層共通
	------------------------------------------------------------------*/
	#contents_block .contents.lower {
		background: #f6f6f6;
	}
	
	/* lowerTtl
	------------------------------------------------------------------*/
	#contents_block .contents.lower .lowerTtl {
		text-align: center;
		padding-top: 40px;
		position: relative;
		z-index: 1;
	}
	#contents_block .contents.lower .lowerTtl h2 {
		font-size: 1.7rem;
		position: relative;
		z-index: 2;
	}
	#contents_block .contents.lower .lowerTtl h2 b {
		font-family: 'Mada', sans-serif;
		font-weight: bold;
		font-size: 4.0rem;
		letter-spacing: 0.1em;
		display: block;
		margin-bottom: 3px;
		line-height: 1;
	}
	#contents_block .contents.lower .lowerTtl .obj01 {
		position: absolute;
		width: 100%;
		top: 0;
		left: 0;
		z-index: 1;
	}
	/* #pickup
	------------------------------------------------------------------*/
	#contents_block .contents.lower #pickup {
		background: #fff;
		overflow: hidden;
		position: relative;
	}
	#contents_block .contents.lower #pickup .inner {
		padding: 45px 10px 100px;
		}
	#contents_block .contents.lower #pickup .secTtl {
		text-align: center;
		font-size: 2.5rem;
		font-family:'Mada', sans-serif;
		margin-bottom: 18px;
		color: #e60012;
		letter-spacing: 0.05em;
	}
	#contents_block .contents.lower #pickup .bnr + .bnr {
		margin-top: 15px;
	}
	#contents_block .contents.lower #pickup .bnr a {
		position: relative;
		display: block;
	}
	
	/* #follow
	------------------------------------------------------------------*/
	#contents_block .contents.lower #follow {
		position: relative;
		background:#fff;
		padding: 40px 0 90px;
	}
	#contents_block .contents.lower #follow .secTtl {
		color: #fff;
		position: relative;
		z-index: 3;
	}
	#contents_block .contents.lower #follow .ttl{
		position: relative;
		text-align:center;
		z-index: 3;
	}
	
	#contents_block .contents.lower #follow .ttl .secTtl {
		color: #fff;
		z-index: 3;
		font-size: 2.9rem;
		font-family:'Mada', sans-serif;
		display: inline-block;
		vertical-align: top;
		letter-spacing: 0.1em;
	}
	#contents_block .contents #follow .instaPost p {
		text-align: center;
		font-size: 1.6rem;
		margin: 40px auto 10px;
		color:#fff;
	}
	#contents_block .contents #follow .instaPost p .icon {
		display: inline-block;
		width: 18px;
		vertical-align: middle;
		margin-right: 5px;
		
	}
	/*iconBtn*/
	#contents_block .contents.lower #follow .iconBtn {
		width: 90px;
		margin: 10px auto 0;
	}
	#contents_block .contents.lower #follow .iconBtn .btn {
		width: 45px;
		height: 45px;
		float: left;
	}
	#contents_block .contents.lower #follow .iconBtn .btn a {
		display: block;
		color: #fff;
		height: 45px;
		border:1px solid #fff;
		position: relative;
	}
	#contents_block .contents.lower #follow .iconBtn .btn.twitter a {
		border-left:0;
	}
	#contents_block .contents.lower #follow .iconBtn .btn span {
		position: absolute;
		top: 50%;
		left: 50%;
		display: block;
		transform: translate(-50%,-50%);
	}
	#contents_block .contents.lower #follow .iconBtn .btn.insta span {
		width: 16px;
		height: 16px;
	}
	#contents_block .contents.lower #follow .iconBtn .btn.twitter span {
		width: 19px;
		height: 15px;
	}
	#contents_block .contents.lower #follow .iconBtn .btn span svg {
		width:100%;
	}

	

	/*instaPost*/
	#contents_block .contents.lower #follow .instaPost {
		position: relative;
		z-index: 3;
	}
	#contents_block .contents.lower #follow .instaPost .postSlider #instafeed {
		overflow: visible;
		width: 100%;
		height: 120px;
		margin: 0 auto;
	}
	#contents_block .contents.lower #follow .instaPost .postSlider #instafeed .slick-slide {
		width: 130px;
		height: 120px;
		float: left;
	}
	#contents_block .contents.lower #follow .instaPost .postSlider #instafeed div span {
		display: block;
		width: 120px;
		height: 120px;
		position: relative;
		margin-left: 10px;
	}
	#contents_block .contents.lower #follow .instaPost .postSlider #instafeed div span img.square,
	#contents_block .contents.lower #follow .instaPost .postSlider #instafeed div span img.tall{
		width: 100%;
		height: auto;
	}
	#contents_block .contents.lower #follow .instaPost .postSlider #instafeed div span img.wide {
		height: 100%;
		width: auto;
	}
	#contents_block .contents.lower #follow .instaPost .postSlider #instafeed div span img {
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%,-50%);
	}
	#contents_block .contents.lower #follow .obj01 {
		width: 36%;
		left: 0;
		top: -10%;
		z-index: 1;
		position: absolute;
	}
	#contents_block .contents.lower #follow .obj02 {
		width: 39%;
		right: 0;
		top: 26%;
		z-index: 1;
		position: absolute;
	}
	#contents_block .contents.lower #follow .bg {
		height: 39%;
		width: 800px;
		background: #fff;
		position: absolute;
		z-index: 2;
		top: 0;
		left: 50%;
		margin-left: -400px;
		transform: rotate(-10deg);
		overflow: hidden;
	}
	#contents_block .contents.lower #follow .bg:after {
		content: "";
		height: 100%;
		width: 0;
		background: #e60012;
		position: absolute;
		z-index: 1;
		top: 0;
		left: 50%;
		margin-left: -400px;
		overflow: hidden;
		transition: 1.0s cubic-bezier(0.19, 1, 0.22, 1);
	}
	#contents_block .contents.lower #follow .bg.animate:after {
		width: 800px;
	}
	#contents_block .contents.lower #follow .pagetop {
		width: 16%;
		position: absolute;
		bottom: 15px;
		right: 20px;
	}

}