@charset "utf-8";
/* ==================================================================
CSS information
style info : ファンキット
================================================================== */


/* --------------------------------------------------------
OVERWRITE
-------------------------------------------------------- */
#section-Area { padding-top: 9.375%;}
@media screen and (min-width: 641px) {
	#section-Area { padding-top: 2.857142%; padding-bottom: 0;}
}
@media screen and (min-width: 1401px) {
	#section-Area { padding-top: 40px;}
}

/* --------------------------------------------------------
COMMON
-------------------------------------------------------- */
.block-set { background: #80d5fc; border-radius: 12px; padding: 5.172413%;}/* in w520 */
.block-set .subhl { width: 79.038461%; margin: -11.538461% auto 3.846153%;}/* w411 */

.block-list { width: 100%; letter-spacing: -.45em; }
.block-list li { letter-spacing: normal; display: inline-block; }
.block-list li a { display: block; text-decoration: none; overflow: hidden; color: #fff;}
@media screen and (min-width: 641px) {
	.block-set { padding: 2.272727%;}/* in w1260 */
	.block-set .subhl { max-width: 411px; width: 32.619047%; margin: -4.761904% auto 1.587301%;}

	.block-list { }
	.block-list li > a { -webkit-transform: scale(1); transform: scale(1);　-webkit-transition: .1s ease-in-out; transition: .1s ease-in-out; -webkit-backface-visibility: hidden; display: block;}
	.block-list li > a:hover { -webkit-transform: scale(1.03); transform: scale(1.03);}
}


/* --------------------------------------------------------
#section-Funkit
-------------------------------------------------------- */
#section-Funkit { position: relative; padding-bottom: 0; }

#section-Funkit .hl { margin-bottom: 4.827586%; position: relative; z-index: 2; }
#section-Funkit .readtext { background: rgba(255,255,255,0.2); border-radius: 12px; padding: 1.724137%; line-height: 1.61; margin-bottom: 5%;}
#section-Funkit .readtext br { display: none; }
#section-Funkit .readtext a { color: #f00; text-decoration: underline;}

#section-Funkit .wrap_sen { margin-bottom: 10%; text-align: center;}
#section-Funkit .wrap_sen a { }
#section-Funkit .wrap_sen .btn_sen { }

@media screen and (min-width: 641px) {
	#section-Funkit { padding: 0 0 5%; }
	
	#section-Funkit .hl { width: 42.575757%; max-width: 562px; margin: 0 auto 3.409090%; }
	#section-Funkit .readtext { display: block; padding: 0.757575%; text-align: center; margin: 0 auto 3%;}
	#section-Funkit .readtext br { display: block; }

	#section-Funkit .wrap_sen { margin-bottom: 6.060606%;}
	#section-Funkit .wrap_sen a { display: inline-block; max-width: 645px; width: calc(645/1320 * 100%)}

	#section-Funkit .wrap_sen a .btn_sen { -webkit-transform: scale(1); transform: scale(1);　-webkit-transition: .1s ease-in-out; transition: .1s ease-in-out; -webkit-backface-visibility: hidden; display: block;}
	#section-Funkit .wrap_sen a:hover .btn_sen { -webkit-transform: scale(1.03); transform: scale(1.03);}
}


/* --------------------------------------------------------
#wallpaper
-------------------------------------------------------- */
#wallpaper { margin-bottom: 10%;}
#wallpaperList.block-list li { width: 100%; margin-bottom: 3.448275%; }
#wallpaperList.block-list li:last-child { margin-bottom: 0; }

/*#wallpaperList.block-list .btnset { letter-spacing: -.45em; text-align: center; margin-top: 3.448275%;}
#wallpaperList.block-list .btnset span { letter-spacing: normal; vertical-align: top; display: inline-block; border: 1px solid #fff; background: #fff; border-radius: 6px; 
	-webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; }*/
#wallpaperList.block-list .btnset { display: -webkit-flex; display: flex; -webkit-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-justify-content: space-between; justify-content: space-between; -webkit-align-items: stretch; align-items: stretch; text-align: center; margin-top: 2.692307%;}
#wallpaperList.block-list .btnset span { border: 1px solid #fff; background: #fff; border-radius: 6px; 
	-webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; }
#wallpaperList.block-list .btnset span a { display: block; border: 2px solid #ff8400; border-radius: 6px; color: #000; padding: 4% 1%; white-space: nowrap;
background: rgb(255,219,79);
background: -webkit-linear-gradient(top, rgba(255,219,79,1) 0%,rgba(254,172,35,1) 100%);
background: linear-gradient(to bottom, rgba(255,219,79,1) 0%,rgba(254,172,35,1) 100%);
}
@media screen and (max-width: 640px) {
#wallpaperList.block-list .btnset span { font-size: 2.43125vw;}
#wallpaperList.block-list .btnset span { width: 24.038461%; }
}
@media screen and (min-width: 641px) {
	#wallpaper { margin-bottom: 6.060606%; }
	
	#wallpaperList.block-list { text-align: center;}
	#wallpaperList.block-list li { max-width: 510px; width: 40.476190%; margin: 0 4%; }
	#wallpaperList.block-list .btnset { margin-top: 1.960784%;}/* mt10 */
	#wallpaperList.block-list .btnset span { font-size: 0.86vw;}
	#wallpaperList.block-list .btnset span { width: 24%; }
	#wallpaperList.block-list .btnset span:hover a { background: rgba(255,219,79,1);}
}
@media screen and (min-width: 1401px) {
	#wallpaperList.block-list .btnset span { font-size: 1.2rem;}
}


/* --------------------------------------------------------
#twicon
-------------------------------------------------------- */
#twicon { margin-bottom: 10%;}
#twiconList.block-list li { width: 24.038461%; margin-right: 0.961538%; margin-bottom: 0.961538%; }/* w125 mr5 mb5 */
#twiconList.block-list li a ,
#twiconList.block-list li img { border-radius: 200px;}
@media screen and (max-width: 640px) {
#twiconList.block-list li:nth-child(4n) { margin-right: 0; }
}
@media screen and (min-width: 641px) {
	#twicon { margin-bottom: 6.060606%; }
	
	#twiconList.block-list li { max-width: 145px; width: 11.507936%; margin-right: 1.111111%; margin-bottom: 1.111111%; }/* mr14 mb14 */
	#twiconList.block-list li:nth-child(8n) { margin-right: 0; }
	#twiconList.block-list li > a:hover { -webkit-transform: scale(1.08); transform: scale(1.08);}
}


/* --------------------------------------------------------
#twheader
-------------------------------------------------------- */
#twheader {}
#twheaderList.block-list li { width: 100%; margin-bottom: 2.884615%; }/* mb15 */
#twheaderList.block-list li:last-child { margin-bottom: 0; }

@media screen and (min-width: 641px) {
	#twheader { }
	
	#twheaderList.block-list li { max-width: 400px; width: 31.746031%; margin-bottom: 0; }
	#twheaderList.block-list li:nth-child(2n) { margin-left: 2.380952%; margin-right: 2.380952%;}
	#twheaderList.block-list li > a:hover { -webkit-transform: scale(1.05); transform: scale(1.05);}
}