@import url('https://fonts.googleapis.com/css?family=Noto+Sans+JP:300,400,500,700,900');

/*------------------------------------------------
					common
------------------------------------------------*/
.row {
	text-align:center;
	max-width:1200px;
	width:100%;
	box-sizing:border-box;
	margin:0 auto;
}
img {
	transition: 3s;
}

/*------------------------------------------------
					header
------------------------------------------------*/
header h1 {
	background:url('../img/head_bg_sp.png') center center no-repeat;
	margin:0 auto;
	background-size:cover;
	text-align:center;
	padding:20px 0;
	position:relative;
	z-index:3
}
header .visual {
	background:url('../img/visual.jpg') center 19% no-repeat #fafafa;
	background-size:131%;
	margin-top:-9px;
	padding:2% 10px 15%;
}
header .visual img {
	padding:10% 0 3%;
}
header .visual .text {
	text-align:center;
	padding:25px;
	font-size:13px;
}
header .visual .text strong {
	font-size:20px;
}
header .visual .text strong span {
	font-size:22px;
	font-weight:bold;
}

#closeHead h1 {
	background:url('../img/head_bg_sp.png') center center no-repeat;
	background-size: cover;
	background-color: transparent;
	text-align: center;
	position: absolute;
	width: 100%;
	top: 0;
	padding: 20px 0;
	z-index: 0;
}
#closeHead .visual {
	background:url('../img/visual_sp.jpg') center 33% no-repeat #fafafa;
	background-size:130%;
	margin-top: 50px;
}
#closeHead .mainImg .mainImg1 {
	padding: 24vw 0 6.666vw;
	width: 76.133vw;
}
#closeHead .mainImg .mainImg2 {
	width: 82.666vw;
	padding: 0 0 10.666vw;
}
#closeHead .visual .text {
	padding: 0 0 10.666vw;
	position: relative;
	z-index: 0;
}
#closeHead .visual .text .text-bb {
	font-size:4.533vw;
	position: relative;
	z-index: 10;
	font-weight: 500;
}
#closeHead .visual .text .text-bb::after {
	display: block;
	content: "";
	position: absolute;
	width: 100%;
	height: 10px;
	background-color: #ffeaab;
	left: 50%;
	transform: translateX(-50%);
	bottom: 0;
	z-index: -1;
}

/*social network*/
.social {
	margin-bottom: 4.8vw;
	padding: 0 2%;
}
.social a.insta,
.time a.insta {
	background-image: linear-gradient(to bottom right, #df0cb0, #ff7d2f);
	margin:0 1% 0 1%;
}
.social a,
.time a {
	float:left;
	width:48%;
	background:#55acee;
	text-align:center;
	border-radius:50px;
	padding:4%;
	margin:0 0 0 1%;
}
.social a i,
.time a i {
	color:#fff;
	font-size:2em;
}

/*  modal*/
.modalBg {
	position: fixed;
	top: 0;
	left: 0;
	display: block;
	width: 100%;
	height: 100%;
	background-color: rgba(255,255,255,0.5);
	cursor: pointer;
	z-index: 1;
}
.modalBox {
	width:84%;
	padding: 6vw;
	display: -webkit-flex;
	display: -ms-flex;
	display: flex;
	justify-content: space-between;
	position: fixed;
	top: 50%;
	left: 50%;
	right: 50%;
	transform: translateX(-50%) translateY(-50%);
	background-color: #fff;
	border-radius: 5px;
	box-sizing: border-box;
	z-index: 1000;
	box-shadow:0px 0px 20px -9px #666666;

}
.modalBox_sns {
	width:100%;
}
.modalBox_txt {
	width: 100%;
}
.modalBox_txt_ttl {
	width: 100%;
	margin-bottom: 6.666vw;
}
.modalBox_txt_thx {
	width: 100%;
	margin-bottom: 5.333vw;
}
.modalBox_txt_msg {
	max-width: 350px;
	width: 100%;
	font-size: 3.2vw;
	color: #452222;
	line-height: 1.8;
	margin: 0 auto 5.333vw;
}
.modalBox_txt_close {
	width: 100%;
	max-width: 170px;
	cursor: pointer;
	text-align: center;
	background-color: #452222;
	border-radius: 10vw;
	margin: 0 auto;
	font-size: 3.2vw;
	line-height: 3;
	color: #fff;
}
.slick-list {
	border-radius: 5px;
}
.slick-dots li button:before {
	content: none!important;
}
.slick-dots li {
	width: 5px!important;
	height: 5px!important;
	border-radius: 10vw;
	background-color: #cccccc;
	margin: 0 7px!important;
}
.slick-dots li.slick-active {
	background-color: #452222;
}
.slick-dots {
	bottom: -25px!important;
}





/*------------------------------------------------
--------------------------------------------------
				contents start
--------------------------------------------------
------------------------------------------------*/
.contents {
	padding:20px;
}
.contents .title h2 {
	font-size:24px;
	color:#c55555;
	padding:15px 0;
}
.contents .title p {
	padding:20px 0;
	font-size:11px;
}
.award p {
	padding:20px 0;
}

.award .award-box {
	padding:0 0 30px;
}
.award .img {
	padding:0 0 20px;
}
.award .button a {
	float:left;
	width:50%;
	text-align:center;
	color:#000;
}
.award .button span {
	display:block;
	color:#c55555;
	font-size:12px;
	background:url('../img/arrow_right.jpg') 85% no-repeat;
	background-size:5%;
}

.award .button.three a {
	width:33.33%;
}
.award .button.three span {
	background:url('../img/arrow_right.jpg') 100% no-repeat;
	background-size:8%;
}
.award .small {
	text-align:left;
	font-size:12px;
}



.pink-bg {
	background:url('../img/pink_bg.jpg') repeat;
	padding:40px 0 80px;
}
.campaign {
	padding-bottom:20%;
}
.campaign .box {
	margin:40px 20px 20px;
	padding:20px;
	background:#fff;
	border-radius:10px;
}
.campaign .box h2 img {
	display:inline-block;
	position:relative;
	top:-6px;
}
.campaign .box h2 {
	font-size:30px;
	color:#c55555;
	font-weight:bold;
}
.campaign .box h2 i {
	font-size:30px;
}
.campaign .box strong {
	color:#c55555;
	font-size: 1.2em;
}
.campaign .box p {
	font-size:16px;
	text-align:left;
}
.campaign .box span {
	display:block;
	margin-top:20px;
}


.campaign .social {
	padding:0 20px;
}
.campaign .social .img {
	padding:20px 40px 40px;
}

.social p {
	display: inline-block;
	padding: 3% 0 0;
	font-size: 14px;
}

.campaign.item {
	padding-bottom:10%;
}
.campaign.item ul {
	padding:30px 20px;
}
.campaign.item li {
	float:left;
	width:48%;
	margin-right:5px;
	margin-bottom:10px;
}
.campaign.item li:nth-child(2n+2) {
	margin-right:0;
	margin-left:5px;
}
.campaign.item li a {
	color:#c55555;
}
.campaign.item li a span {
	font-size:14px;
	background:url('../img/arrow_right.png')90% no-repeat;
	background-size:auto;
	display:block;
	padding:5% 0;
}
.campaign.item li.two a span {
	text-align:center;
}


.campaign.time {
	padding:0;
}
.campaign.time .text-box {
	padding:20px;
}
.campaign.time .text-box p {
	font-weight:bold;
	font-size:16px;
}
.campaign.time .text-box p span {
	font-size:20px;
	font-weight:bold;
}
.campaign.time .text-box p.gray {
	font-weight:normal;
	font-size:12px;
	color:#333;
	margin: 0 0 8%;
}




#accordion {
	padding:40px 20px;
}
#accordion .ft-ttl {
	position:relative;
}
#accordion .ft-ttl h2 {
	font-size:25px;
	font-weight:bold;
	background:#fff;
	position:relative;
	z-index:5;
	display:inline;
	padding:0 20px;
}
#accordion .ft-ttl p {
	background:#333;
	width:100%;
	height:1px;
	position:absolute;
	top:50%;
}

.accordion {
	background-color: #fff;
	border-bottom:1px solid #333;
	border-top:none;
	border-left:none;
	border-right:none;
	color: #444;
	cursor: pointer;
	padding: 18px 0;
	width: 100%;
	text-align: left;
	outline: none;
	font-size: 15px;
	transition: 0.4s;
	font-weight:bold;
}
.accordion.active {
	border-bottom:none;
}

.accordion:after {
	content: '\002B';
	color: #333;
	font-weight: bold;
	float: right;
	font-size:22px;
	margin-right: 0;
}

.active:after {
  content: "\2212";
}

.panel {
	text-align:left;
	padding: 0;
	background-color: white;
	max-height: 0;
	overflow: hidden;
	transition: max-height 0.2s ease-out;
}
.panel p {
	font-family: 'Noto Sans JP', sans-serif;
	padding:10px 0;
	color:#333;
}
.panel p.last {
	border-bottom:1px solid #333;
}
.panel p.last a {display:inline-block}


.pc-show {display:none;}

.award p br {display:none;}
.award p.small br {display:inline-block;}


/*scroll top*/
#scroll-top {
    position: fixed;
    bottom: 20px;
    right: 20px;
    width: 50px;
    height: 50px;
    text-decoration: none;
    -webkit-border-radius: 35px;
    -moz-border-radius: 35px;
    border-radius: 35px;
    -webkit-transition: all 0.3s linear;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
	z-index:9999;
	background: #c55555;
}
#scroll-top i {
    color: #fff;
    margin: 0;
    position: relative;
    top: 13px;
	left:37%;
    font-size: 19px;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}
#scroll-top:hover i {
    color: #fff;
    top: 5px;
}




/*modal*/









/*------------------------------------------------
					responsive
------------------------------------------------*/
@media screen and (min-width: 768px) {
	header .mainImg .mainImg1 {
		max-width: 609px;
		width: 100%;
		margin: 0 auto;
		padding: 110px 0 30px;
	}
	header .mainImg .mainImg2 {
		max-width: 620px;
		width: 100%;
		margin: 0 auto;
		padding: 0 0 60px;
	}
	.modalBox_txt_ttl {
		margin-bottom: 40px;
	}
	.modalBox_txt_thx {
		margin: 0 auto 30px;
	}
	.modalBox_txt_msg {
		margin: 0 auto 25px;
	}
	.modalBox_sns{
		max-width: 380px;
	}
	.modalBox_txt {
		width: 50%;
	}
	.modalBox_txt_msg {
		font-size: 18px;
	}
	.modalBox_txt_close {
		font-size: 20px;
	}
	.award .button {
		width:80%;
		text-align:center;
		margin:0 auto;
	}
	.award .button span {
		background-size: auto;
	}
	.award .button.three span {
		background-size: auto;
	}

}
@media screen and (min-width: 1280px) {
	.pc-hide {display:none;}
	.pc-show {display:block;}
	.award p br {display:inline-block;}

	header h1 {
		background:url('../img/head_bg.png') center center no-repeat;
	}
	header .visual {
		background:url('../img/visual.jpg') center top no-repeat #fafafa;
		padding:2% 10px 7%;
		margin-top:-43px;
		background-size:auto;
	}
	header .visual img {
		padding:10% 0 3%;
	}
	header .visual .text {
		padding:25px 20px 6%;
		font-size:24px;
	}
	header .visual .text strong {
		font-size:28px;
	}
	header .visual .text strong span {
		font-size:34px;
	}

	#closeHead h1 {
		background:url('../img/head_bg.png') center center no-repeat;
		background-color: transparent;
		position: absolute;
		width: 100%;
		top: 0;
	}
	#closeHead .visual {
		background:url('../img/visual.jpg') center top no-repeat #fafafa;
		background-size:auto;
		margin-top: 50px;
	}
	#closeHead .mainImg img {
		display: block;
	}
	#closeHead .mainImg .mainImg1 {
		max-width: 609px;
		width: 100%;
		margin: 0 auto;
		padding: 110px 0 30px;
	}
	#closeHead .mainImg .mainImg2 {
		max-width: 620px;
		width: 100%;
		margin: 0 auto;
		padding: 0 0 60px;
	}
	#closeHead .visual .text {
		padding: 0 0 5%;
	}
	#closeHead .visual .text .text-bb {
		font-size:34px;
	}
	#closeHead .visual .text .text-bb::after {
		height: 13px;
		bottom: 3px;
	}

	/*  modal*/
	.modalBox {
		max-width: 940px;
		padding: 50px 50px 30px;
	}
	.modalBox_sns {
		max-width: 380px;
	}
	.modalBox_txt {
		width: initial;
	}
	.modalBox_txt_ttl {
		max-width: 420px;
		margin-bottom: 40px;
	}
	.modalBox_txt_thx {
		max-width: 385px;
		margin: 0 auto 30px;
	}
	.modalBox_txt_msg {
		font-size: 18px;
		margin: 0 auto 25px;
	}
	.modalBox_txt_close {
		font-size: 20px;
		line-height: 2.5;
	}
	.slick-dots {
		bottom: -30px!important;
	}

	/*social network*/
	.social {
		margin-bottom: 40px;
	}
	.social a.insta,
	.time a.insta {
		background-image: linear-gradient(to bottom right, #df0cb0, #ff7d2f);
		margin:0 1% 0 1%;
	}
	.social a,
	.time a {
		display:inline-block;
		float:none;
		width:25%;
		border-radius:80px;
		padding:30px 0;
	}
	.social a i,
	.time a i {
		font-size:3em;
	}

	.social p {
	font-size: 22px;
	padding: 0;
	}

	.contents .title h2 {
		padding:7% 0 0;
	}
	.contents .title p {
		font-size:20px;
		padding:30px 0;
	}


	.award .align {
		display:inline-block;
	}
	.award p {
		font-size:22px;
		padding:40px 0;
	}
	.award .award-box, .award .small {
		display:inline-block;
		vertical-align:top;
		width:48%;
	}
	.award .award-box {
		padding:0 20px 50px;
	}
	.award .button {
		width:100%;
	}
	.award .button a {
		font-size:20px;
	}
	.award .button span {
		font-size:18px;
		background:url('../img/arrow_right.jpg') 76% no-repeat;
		background-size:auto;
	}
	.award .button.three span {
		background:url('../img/arrow_right.jpg') 88% no-repeat;
		background-size:auto;
	}
	.award .small {
		padding:0 20px;
	}
	.award .small p {
		background:#fafafa;
		padding:40px;
		border-radius:10px;
		font-size:18px;
	}


	.pink-bg {
		padding:6% 0;
	}
	.campaign {
		padding-bottom:10%;
	}
	.campaign .box {
		display:inline-block;
		margin:40px 0 20px;
		width:45.60%;
		padding-bottom: 35px;
	}
	.campaign .height {
		padding-top: 48px;
		padding-bottom: 35px;
	}

	.campaign .img-box {
		display:inline-block;
		margin-top:-15%;
		padding:0 23px;
		vertical-align:middle;
	}
	.campaign img.arrow-btm {
		transform: rotate(-90deg);
	}

	.campaign .social {
		padding:0;
	}
	.campaign .social img {
		display:inline-block;
		width:46%;
	}
	.campaign .social a {
		vertical-align:top;
		margin-top:25px;
	}

	.campaign.item ul {
		padding:5% 0 0;
	}
	.campaign.item li {
		float:none;
		display:inline-block;
		width:32%;
		margin:0 0 23px 9px !important;
	}
	.campaign.item li.two {
		width:48%;
		text-align:right;
		margin:0 9px 23px !important;
	}
	.campaign.item li a span {
		font-size:18px;
		background:url('../img/arrow_right.png') 68% no-repeat;
		background-size:auto;
		display:block;
		padding:5% 0;
	}

	.campaign.item li.two.right {
		text-align:left;
	}
	.campaign.item li:nth-child(2n+2) {
		margin-left:0;
	}
	.campaign.item li a {display:inline-block;}


	.campaign.time .text-box {
		padding:20px 0 0;
	}
	.campaign.time .text-box p {
		font-size:38px;
	}
	.campaign.time .text-box p span {
		font-size:47px;
	}
	.campaign.time .text-box p {
		padding:20px 0;
	}
	.campaign.time .text-box p.gray {
		font-size:23px;
		padding:0;
		margin: 0 0 5%;
	}

	.accordion:after {
		color: #333;
		float: right;
		font-size:22px;
	}

	#accordion {
		padding:6% 0;
	}
	#accordion .ft-ttl {
		margin-bottom:20px;
	}
	#accordion .ft-ttl h2 {
		font-size:42px;
		padding:0 18%;
	}

}