@charset "UTF-8";
/* CSS Document */

html {
	font-size: 10px;
}

body {
	-webkit-text-size-adjust: 100%;
	background-color: #000;
	color: #FFF;
	font-family: Verdana, 'Lucida Grande', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, sans-serif;
	line-height: 1.5;
	letter-spacing: 0.1rem;
	font-size: 1.4rem;
}

/* fonts
-------------------------------------------------------------- */

@font-face {
    font-family: 'YONEtx';
    src: url('../fonts/corbelbi.eot.eot');
    src: url('../fonts/corbelbi.eot?#iefix') format('embedded-opentype'),
         url('../fonts/corbelbi.woff2') format('woff2'),
         url('../fonts/corbelbi.woff') format('woff'),
         url('../fonts/corbelbi.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}


@font-face {
	font-family: 'JPtx';
	src: url('../fonts/NotoSansCJKjp-Black.eot');
	src: url('../fonts/NotoSansCJKjp-Black?#iefix') format('embedded-opentype'),
		  url('../fonts/NotoSansCJKjp-Black.woff2') format('woff2'),  
		  url('../fonts/NotoSansCJKjp-Black.woff') format('woff'),
		  url('../fonts/NotoSansCJKjp-Black.ttf') format('truetype');
		  font-style: normal;
		  font-weight: 900; 
}


.yoneTx {
	font-family: YONEtx, Verdana, 'Lucida Grande', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, sans-serif;
}

.jpnTx_bold {
	font-family: JPtx, Verdana, 'Lucida Grande', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, sans-serif;
	font-weight: 900;
}

.gtc {
	font-family: Verdana, 'Lucida Grande', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, sans-serif;
}

.mnc {
	font-family: "Times New Roman", "游明朝", YuMincho, "Hiragino Mincho ProN", Meiryo, serif;
}

.maru {
	font-family:"ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO";
}


/* Debug
-------------------------------------------------------------- */

.scrollValue {
    margin: 0;
    position: fixed;
    right: 10px;
    top: 10px;
	color: #066;
	font-size: 35px;
	z-index: 500;
}


/* samples
-------------------------------------------------------------- */

.sample_textLR {
	text-align: justify;
	text-justify: inter-ideograph;
}

.sample_minFontSize {
	font-size: 23px;
	font-size: -webkit-calc(23px + 12vw);
	font-size: -moz-calc(23px + 12vw);
	font-size: calc(23px + 12vw);
	line-height: 36px;
	line-height: -webkit-calc(36px + 12vw);
	line-height: -moz-calc(36px + 12vw);
	line-height: calc(36px + 12vw);
}

.sample_radius {
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px;
}

.sample_grad {
	background: -webkit-gradient(linear, left top, left bottom, from(#FFF), color-stop(0.9,rgba(255,255,255,0)));
	background: -webkit-linear-gradient(top, #FFF, rgba(255,255,255,0) 90%);
	background: linear-gradient(to bottom, #FFF, rgba(255,255,255,0) 90%);
}

.sample_transition {
	transition: .5s;
}

.sample_transition:hover {
	opacity: .7;
}

.sample_radial {
	transform: rotate(-2deg);
	-moz-transform: rotate(-2deg);
	-webkit-transform: rotate(-2deg);
	-o-transform: rotate(-2deg);
	-ms-transform: rotate(-2deg);
}

.sample_noSelect {
	-moz-user-select: none;
	-webkit-user-select: none;
	-ms-user-select: none;
}

.sample_shadow_box {
	/*左右 上下 ぼかし 広がり 色 内側指定（inset）*/
	box-shadow: 2px 2px 4px;
}

.sample_shadow_text {
	font-family: largetxt, "Times New Roman", "游明朝", YuMincho, "Hiragino Mincho ProN", Meiryo, serif;
	text-shadow: 0 0 15px #272727;
}


/* general
-------------------------------------------------------------- */

.onlyPC, .onlyPC_il {
	display: none;
}

.onlySP_il {
	display: inline;
}

.textHide {
	text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
}

.pdgL_3 {
	padding-left: 3px;
}


/* canvas
-------------------------------------------------------------- */

#efxbg {
	position: fixed;
	z-index: -20;
	width: 100%;
	height: 100%;
	opacity: .85;
}

#paralaxBG {
	position: fixed;
	z-index: -30;
	width: 100%;
	height: 100%;
	background-image: url(../images/bg_mainBK.jpg);
	background-position: center 0px;
}




/* menu
-------------------------------------------------------------- */

@keyframes checked-anim {
    100% {
        width: 100%;
    }
}

@keyframes not-checked-anim {
    0% {
        width: 100%;        
    }
}

.ul_menu {
    display: none;
	padding-top: 80px !important;
}

#burger {
    position: fixed;
    top: 0;
    right: 0;
	background-image: url(../images/bt_menu_open.svg);
	background-repeat: no-repeat;
	background-position: center center;
	background-size: contain; 
    width: 70px;
    height: 70px;
    transition: .5s ease;
    cursor: pointer;
    z-index: 1100;
}

#menu-toggle:checked + #burger {
    transform: rotate(180deg);
    transition: transform .5s ease;
}

#main_menu {
    position: fixed;
	right: 0;
    width: 0;
    height: 100%;
    animation: not-checked-anim .2s both;
    transition: .5s;
	z-index: 1000;
	text-align: center;
	background-color: rgba(0,0,0,.9);
}

#menu-toggle:checked ~ #main_menu {
    animation: checked-anim .5s ease both;
}

#menu-toggle:checked ~ #burger {
	background-image: url(../images/bt_menu_close.svg);
	top: 20px;
    right: 20px;
	width: 50px;
    height: 50px;
}

#menu-toggle:checked ~ #main_menu .ul_menu {
    display: block;
}

[type="checkbox"]:not(:checked), [type="checkbox"]:checked {
    display: none;
}

.a_menu, .a_menu:visited {
	font-family: YONEtx, Verdana, 'Lucida Grande', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, sans-serif;
	font-size: 2.6rem;
	letter-spacing: 0;
	line-height: 1.1;
	text-shadow: 0 3px 0 #000;
	color: #FFF;
	padding: 12px 0;
	display: block;
}

.a_menu:hover {
	opacity: .8;
}

.a_logo_menu {
	width: 300px;
	height: 180px;
	position: absolute;
	left: 0;
	top: 0;
	background-image: url(../images/img_topmenu_PC.svg);
	text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
	display: none;
}



/* loading
-------------------------------------------------------------- */

.loadingHP {
	position: fixed;
	height: 100%;
	width: 100%;
	left: 0;
	top: 0;
	z-index: 5000;
	background-color: rgba(0,0,0,.75);
}

.hide_loading {
    display: none;
}


.loading_spc {
	position: absolute;
	top: 0;
	bottom: 0;
	right: 0;
	left: 0;
	margin: auto auto;
	width: 80px;
	height: 100px;
	text-align: center;
}

.icon_loading {
	width: 80px;
	height: 80px;
	margin-bottom: 3px;
	animation:1s linear infinite loading_rot;
}

@keyframes loading_rot{
	0%{ transform:rotate(0);}
	100%{ transform:rotate(360deg); }
}

.tx_loading {
	font-size: 1.1rem;
	color: #FFF;
	line-height: 1;
	letter-spacing: .1rem;
}



/* header
-------------------------------------------------------------- */

#pageTop {
	position: absolute;
	top: 0;
}

.hdr {
	height: 100vh;
	width: 100%;
	position: absolute;
	top: 0;
	left: 0;
}

.hdrMov {
	height: 100vh;
	width: 100%;
	background-size: cover;
	background-position: center;
	position: fixed;
	top: 0;
	text-align: center;
	z-index: -1;
}

.hdr_bgMovie {
	position: absolute;
    top: 0;
	left: 0;
	margin: auto auto;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    background-size: cover;
}

.bg_hdr {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-image: url(../images/bg_hdr.svg);
	background-size: 125% auto;
	background-repeat: no-repeat;
	background-position: center center;
}

.logo_hdr {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto auto;
	width: 100%;
}

.layer_hdrmov {
	background-image: url(../images/layer_hdrmov.png);
	height: 100%;
	position: absolute;
	bottom: 0;
	width: 100%;
}


/* main
-------------------------------------------------------------- */


.main_yonetaro {
	position: relative;
	padding-top: 100vh;
	z-index: 0;
}






/* intro
-------------------------------------------------------------- */

.atcl_intro {
	background-color: rgba(0,0,0,.9);
}

.wrap1, .wrap2 {
	max-width: 1080px;
	margin: 0 auto;
	position: relative;
	padding: 120px 10px 68px;
	background-image: url(../images/bg_blood2.svg);
	background-size: contain;
	background-position: center top 55px;
	background-repeat: no-repeat;
}

.blood_title1 {
	position: absolute;
	top: 0;
	left: 0;
	font-family: YONEtx, Verdana, 'Lucida Grande', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, sans-serif;
	font-size: 2.6rem;
	letter-spacing: 0;
	line-height: 1.1;
	background-image: url(../images/bg_blood1.svg);
	background-position: center top;
	background-size: contain;
	padding-top: 74px;
	width: 120px;
	height: 230px;
	background-repeat: no-repeat;
	text-align: center;
	text-shadow: 0 3px 0 #000;
	-webkit-filter: drop-shadow(2px 3px 6px rgba(0, 0, 0, 0.5));
            filter: drop-shadow(2px 3px 6px rgba(0,0 , 0, 0.5));
}

.youtubeSpc {
	margin: 0 auto 17px;
	background-image: url(../images/bg_frame1.svg);
	background-repeat: no-repeat;
	background-size: 100% 100%;
	background-position: center center; 
	padding: 20px;
}

.youtubeSize {
	width: 100%;
	height: 50vw;
	height: -webkit-calc((100vw - 76px) / 16 * 9);
    height: -moz-calc((100vw - 76px) / 16 * 9);
    height: calc((100vw - 76px) / 16 * 9);
	max-height: 485px;
}

.sc_wrap {
	background-image: url(../images/bg_frame1.svg);
	background-repeat: no-repeat;
	background-size: 100% 100%;
	background-position: center center; 
	padding: 20px;
	display: block;
}





/* scroll blank
-------------------------------------------------------------- */

.scroll_blank {
	height: 22vh;
	position: relative;
}

.scroll_arrow1 {
	position: absolute;
	z-index: 100;
	left: 0;
	right: 0;
	width: 60px;
	bottom: 50px;
	margin: 0 auto;
	-webkit-animation: sdb 1.5s infinite;
	animation: sdb 1.5s infinite;
}

.scroll_arrow2 {
	position: absolute;
	z-index: 100;
	left: 0;
	right: 0;
	width: 60px;
	top: 50px;
	margin: 0 auto;
	-webkit-animation: sdb 1.5s infinite;
	animation: sdb 1.5s infinite;
}

@-webkit-keyframes sdb {
  0% {
    -webkit-transform: translate(0, 0);
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
  100% {
    -webkit-transform: translate(0, 20px);
    opacity: 0;
  }
}

@keyframes sdb {
  0% {
    transform: translate(0, 0);
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
  100% {
    transform: translate(0, 20px);
    opacity: 0;
  }
}





/* banners
-------------------------------------------------------------- */


.swipeBanner_spc {
	margin-bottom: 36px;
}

.swipeBanner_spc_wrap {
	background-color: rgba(255,255,255,.3);
	max-width: 1080px;
	margin: 0 auto;
	padding: 10px 0;
}





/* live
-------------------------------------------------------------- */

.atcl_live {
}

.ul_live {
}

.li_live {
	border: 3px solid #3D3D3D;
	padding: 10px;
	margin-bottom: 10px;
	background-position: center center;
	background-size: cover;
	background-repeat: no-repeat;
}

.li_live:nth-child(3n+1) {
	background-image: url(../images/bg_prof_yone.jpg);
}

.li_live:nth-child(3n+2) {
	background-image: url(../images/bg_prof_ogi.jpg);
}

.li_live:nth-child(3n) {
	background-image: url(../images/bg_prof_koba.jpg);
}

.img_live_H {
	max-width: 220px;
	display: inline-block;
}

.img_live_V {
	max-width: none;
	max-height: 220px;
	display: inline-block;
}






/* disco
-------------------------------------------------------------- */

.atcl_disco {
}

.if_disco {
	margin-bottom: 10px;
}

.if_disco:first-child {
	margin-top: 10px;
}

.z_idx_minus {
	z-index: -1;
}









/* bio
-------------------------------------------------------------- */

.atcl_bio {
}

.bio_blk {
	margin: 16px 0;
	background-position: center center;
	background-size: cover;
	background-repeat: no-repeat;
}

.bg_bio_blk1 {background-image: url(../images/img_face_bw1.jpg);}
.bg_bio_blk2 {background-image: url(../images/img_face_bw2.jpg);}
.bg_bio_blk3 {background-image: url(../images/img_face_bw3.jpg);}



.bt_bio {
	height: 59px;
	transition: .5s;
	padding-top: 16px;
	background-position: center center;
	background-size: cover;
	background-repeat: no-repeat;
	cursor: pointer;
	position: relative;
	-moz-user-select: none;
	-webkit-user-select: none;
}

.bt_bio_open {
	padding-top: 8px;
	height: 34px;
}

.bt_bio_open.bt_bio_yone {background-image: url(../images/img_face_col1.jpg);}
.bt_bio_open.bt_bio_ogi {background-image: url(../images/img_face_col2.jpg);}
.bt_bio_open.bt_bio_koba {background-image: url(../images/img_face_col3.jpg);}


.bio_name {
	font-family: YONEtx, Verdana, 'Lucida Grande', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, sans-serif;
	font-size: 2.6rem;
	letter-spacing: 0;
	line-height: 1.1;
	text-align: center;
	text-shadow: 0 3px 0 #000;
}

.bt_bio_open .bio_name {
	font-size: 1.6rem;
}

.bio_detail {
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
	padding: 8px 8px 20px;
	display: none;
}

.bt_prof_close {
	width: 30px;
	height: 30px;
	background-image: url(../images/bt_close2.svg);
	background-position: center center;
	background-repeat: no-repeat;
	text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
	position: absolute;
	top: 0;
	right: 10px;
	bottom: 0;
	margin: auto 0;
	display: none;
}

.bio_detail_yone {background-image: url(../images/bg_prof_yone.jpg);}
.bio_detail_ogi {background-image: url(../images/bg_prof_ogi.jpg);}
.bio_detail_koba {background-image: url(../images/bg_prof_koba.jpg);}

.img_prof {
	width: 100%;
	margin: 0 auto 13px;
}

.a_link1, .a_link1:visited {
	text-decoration: underline;
	color: #CCC;
	font-size: 1.2rem;
	margin-bottom: 23px;
}

.a_link1:hover {
	opacity: .8;
}






/* profile-bio-
-------------------------------------------------------------- */

.txL4 {
	font-family: YONEtx, Verdana, 'Lucida Grande', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, sans-serif;
	font-size: 3.4rem;
	text-align: center;
	margin-top: -34px;
	text-shadow: 2px 3px 0 #000;
	margin-bottom: 16px;
}

.prof_spc {
	padding: 0 10px 30px;
}






/* goods
-------------------------------------------------------------- */


.atcl_goods {
}



.blk_spc {
	font-size: 0;
	letter-spacing: 0;
	line-height: 1;
}


.thumbs_blk {
	width: 50%;
	vertical-align: top;
	display: inline-block;
	padding: 3px;
	background-color: #000;
	letter-spacing: .1rem;
	margin-bottom: 17px;
}

.thumbs_blk_inner {
	background-color: #3D3D3D;
	padding: 4px;
}

.img_goods {
	margin-bottom: 10px;
}

.txL1 {
	font-size: 1.6rem;
	line-height: 1.4;
	font-family: JPtx, Verdana, 'Lucida Grande', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, sans-serif;
	font-weight: 900;
	margin-bottom: 5px;
}

.txL2 {
	font-size: 1.6rem;
	line-height: 1.4;
	font-family: JPtx, Verdana, 'Lucida Grande', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, sans-serif;
	font-weight: 900;
	margin-bottom: 12px;
}

.txL3 {
	font-size: 2.2rem;
	line-height: 1.4;
	font-family: YONEtx, Verdana, 'Lucida Grande', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, sans-serif;
	margin-bottom: 7px;
}

.tx1 {
	font-size: 1.3rem;
	line-height: 1.6;
	margin-bottom: 18px;
}

.txS1 {
	font-size: 1.2rem;
}


.bt_red {
	display: inline-block;
	width: 100%;
	max-width: 480px;
	margin: 0 auto 17px;
	background-color: #910D12;
	font-family: JPtx, Verdana, 'Lucida Grande', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, sans-serif;
	color: #FFF;
	text-align: center;
	line-height: 1.2;
	padding: 10px 0;
	position: relative;
	font-size: 1.2rem;
	letter-spacing: .2rem;
	cursor: pointer;
	-moz-user-select: none;
	-webkit-user-select: none;
	-ms-user-select: none;
}

.bt_red:hover {
	opacity: .8;
}

.icon_cart::before {
	content:'';
	position: absolute;
	left: 5px;
	top: 0;
	bottom: 0;
	margin: auto 0;
	width: 20px;
	height: 20px;
	background-image: url(../images/icon_cart.svg);
	background-position: center center;
	background-repeat: no-repeat;
}

.icon_access::before {
	content:'';
	position: absolute;
	left: 5px;
	top: 0;
	bottom: 0;
	margin: auto 0;
	width: 20px;
	height: 20px;
	background-image: url(../images/icon_mappin.svg);
	background-position: center center;
	background-repeat: no-repeat;
}

.gray_out {
	opacity: .3 !important;
	cursor: default !important;
}


.tx_linethrough {
	text-decoration: line-through;
}






/* footer
-------------------------------------------------------------- */

.bt_scrolltoTop {
	width: 60px;
	height: 60px;
	background-image: url(../images/bt_scrolltoTop.svg);
	background-repeat: no-repeat;
	position: fixed;
	bottom: 50px;
	right: 0;
	display: none;
	z-index: 500;
}

.ft {
	margin-top: 110px
	padding-bottom: env(safe-area-inset-bottom);
	/*background-color: rgba(0,0,0,.45);*/
	background-image: url(../images/bg_footer.svg);
	background-size: 100% 100%;
	background-position: top center;
	text-align: center;
}

.ft_wrap {
	padding: 80px 0 38px;
}

.logo_ft {
	margin: 0 auto;
	width: 90%;
	max-width: 250px;
}




/* general
-------------------------------------------------------------- */

.pdgL_a {
	padding-left: 3px;
}