/*
Theme Name: DOPING PANDA 2025
Theme URI: https://altstack.com
Author: altstack
Author URI: https://altstack.com
Description: 2025年5月リニューアル用テーマ
Version: 1.0.4
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: doping-panda
Tags:
*/


/**	CSSリセット、再定義 **/


/**
 * CSSリセット
 * 参照元：http: //meyerweb.com/eric/tools/css/reset/
**/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}

body {
	line-height: 1;
}

ol,
ul {
}

blockquote, q {
	quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

strong {
font-weight: bold;
}

/**
 * 再定義
**/

body {
	color: #333333;
	font-family: "Roboto", "Helvetica Neue", Helvetica, Arial, "Noto Sans JP", "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", Meiryo, "メイリオ", sans-serif;
	font-size: 16px;
	line-height: 1.8em;
	letter-spacing: 0px;
	text-align: center;
	background: #000416;
}

table {
	color: #333333;
	font-family: "Roboto", "Helvetica Neue", Helvetica, Arial, "Noto Sans JP", "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", Meiryo, "メイリオ", sans-serif;
	font-size: 16px;
	line-height: 1.8em;
	letter-spacing: 0px;
	empty-cells:	show;
}

table td, table td {
	empty-cells: show;
}

a {
	color: #333333;
	text-decoration: underline;
}

a:hover {
	color: #333333;
	text-decoration: none;
}

img {
	width: 100%;
	height:	auto;
	border: none;
	display: block;
	transition: 0.3s;
}

a:hover img {
	opacity: 0.6;
	transition: 0.3s;
}

em { font-style: normal; }




/** 汎用スタイルシート**/


/**
 * SP表示
**/
.sp_disp { display: none !important; }

/**
 * ライン
**/

hr.line {
	margin: 0 auto;
	width: 100%;
	max-width: 1000px;
	height: 0;
	line-height: 0;
	border: none;
	border-bottom: 2px solid #b6b6b6;
	clear: both;
}


/**
 * フォントファミリー
**/

.mincho {
	font-family: "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif !important;
}


/**
 * フォントカラー
**/

.red { color: #ff0000; }
.green { color: #00cc00; }
.blue { color: #0000ff; }

/**
 * リンクテキスト
**/

.link_text a { text-decoration: underline; }
.link_text a:hover { text-decoration: none; }

/**
 * フォントウェイト
**/

.bold { font-weight: bold !important; }

/**
 * フォントサイズ
**/

.font10 { font-size: 10px !important; }
.font11 { font-size: 11px !important; }
.font12 { font-size: 12px !important; }
.font13 {
	line-height: 150% !important;
	font-size: 13px !important;
}
.font14 {
	line-height: 150% !important;
	font-size: 14px !important;
}
.font15 {
	line-height: 150% !important;
	font-size: 15px !important;
}
.font16 {
	line-height: 150% !important;
	font-size: 16px !important;
}
.font17 {
	line-height: 150% !important;
	font-size: 17px !important;
}
.font20 {
	line-height: 150% !important;
	font-size: 20px !important;
}
.font24 {
	line-height: 150% !important;
	font-size: 24px !important;
}


/**
 * テキストアライン
**/

.txt_right { text-align: right !important; }
.txt_left { text-align: left !important; }
.txt_center { text-align: center !important; }
.txt_center img {
	margin-left: auto !important;
	margin-right: auto !important;
}

/**
 * テキストインデント
**/

.txt_indent { text-indent: 1em; }


/**
 * マージン
**/

/* マージントップ */
.mt05 { margin-top: 5px !important; }
.mt10 { margin-top: 10px !important; }
.mt15 { margin-top: 15px !important; }
.mt20 { margin-top: 20px !important; }
.mt25 { margin-top: 25px !important; }
.mt30 { margin-top: 30px !important; }
.mt35 { margin-top: 35px !important; }
.mt40 { margin-top: 40px !important; }
.mt45 { margin-top: 45px !important; }
.mt50 { margin-top: 50px !important; }
.mt55 { margin-top: 55px !important; }
.mt60 { margin-top: 60px !important; }

/* マージンボトム */
.mb00 { margin-bottom: 0px !important; }
.mb05 { margin-bottom: 5px !important; }
.mb10 { margin-bottom: 10px !important; }
.mb15 { margin-bottom: 15px !important; }
.mb20 { margin-bottom: 20px !important; }
.mb25 { margin-bottom: 25px !important; }
.mb30 { margin-bottom: 30px !important; }
.mb35 { margin-bottom: 35px !important; }
.mb40 { margin-bottom: 40px !important; }
.mb45 { margin-bottom: 45px !important; }
.mb50 { margin-bottom: 50px !important; }
.mb55 { margin-bottom: 55px !important; }
.mb60 { margin-bottom: 60px !important; }
.mb65 { margin-bottom: 65px !important; }
.mb70 { margin-bottom: 70px !important; }
.mb75 { margin-bottom: 75px !important; }
.mb80 { margin-bottom: 80px !important; }
.mb90 { margin-bottom: 90px !important; }
.mb100 { margin-bottom: 100px !important; }
.mb125 { margin-bottom: 125px !important; }

/* マージンレフト */
.ml05 { margin-left: 5px !important; }
.ml10 { margin-left: 10px !important; }
.ml15 { margin-left: 15px !important; }
.ml20 { margin-left: 20px !important; }
.ml25 { margin-left: 25px !important; }
.ml30 { margin-left: 30px !important; }
.ml35 { margin-left: 35px !important; }
.ml40 { margin-left: 40px !important; }
.ml45 { margin-left: 45px !important; }
.ml50 { margin-left: 50px !important; }
.ml55 { margin-left: 55px !important; }
.ml60 { margin-left: 60px !important; }

/* マージンライト */
.mr05 { margin-right: 5px !important; }
.mr10 { margin-right: 10px !important; }
.mr15 { margin-right: 15px !important; }
.mr20 { margin-right: 20px !important; }
.mr25 { margin-right: 25px !important; }
.mr30 { margin-right: 30px !important; }
.mr35 { margin-right: 35px !important; }
.mr40 { margin-right: 40px !important; }
.mr45 { margin-right: 45px !important; }
.mr50 { margin-right: 50px !important; }
.mr55 { margin-right: 55px !important; }
.mr60 { margin-right: 60px !important; }


/**
 * フロート
**/

.fl { float: left; }
.fr { float: right; }


/**
 * ワイド
**/

.w50 { width: 50px !important; }
.w100 { width: 100px !important; }
.w150 { width: 150px !important; }
.w200 { width: 200px !important; }
.w250 { width: 250px !important; }
.w300 { width: 300px !important; }
.w350 { width: 350px !important; }

.w80p { width: 80% !important; }

/**
 * テキスト入力フィールド
**/

input.txt_w19p {
	padding: 0 10px;
	width: 19%;
	height: 28px;
	line-height: 28px;
	font-size: 14px;
	-webkit-border-radius: 0;
	-moz-border-radius: 0;
	border-radius: 0;
	border: 1px solid #cccccc;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

input.txt_w57p {
	padding: 0 10px;
	width: 57%;
	height: 28px;
	line-height: 28px;
	font-size: 14px;
	-webkit-border-radius: 0;
	-moz-border-radius: 0;
	border-radius: 0;
	border: 1px solid #cccccc;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

input.txt_w78p {
	padding: 0 10px;
	width: 78%;
	height: 28px;
	line-height: 28px;
	font-size: 14px;
	-webkit-border-radius: 0;
	-moz-border-radius: 0;
	border-radius: 0;
	border: 1px solid #cccccc;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	
}

textarea.textarea_w96p {
	padding: 10px;
	width: 96%;
	height: 140px;
	line-height: 1.8em;
	font-size: 14px;
	-webkit-border-radius: 0;
	-moz-border-radius: 0;
	border-radius: 0;
	border: 1px solid #cccccc;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}


/**
 * クリア関連
**/

.clear {
	clear: both;
}

.clearfix:after {
	content: ".";
	display: block;
	clear: both;
	height: 0;
	visibility: hidden;
}

.clearfix { min-height: 1px !important; }
* html .clearfix { height: 1px !important; }




/** レイアウト、共通コンテンツ **/


/**
 * ラッパー
**/

#wrapper {
	overflow: hidden;
}


/**
 * ヘッダー
**/
#header {
	width: 100%;
	height: 56.25vw;
	height: 100vh;
	text-align: left;
	position: relative;
	z-index: 10000;
}
body#page #header {
	height: 0px;
}
#header.active {
	z-index: 20000;
}
body#page #header figure.logo,
#header h1#dopingpanda_logo {
	opacity : 0;
	transform : translate(-50px, 0);
	transition:all 0.5s;
	position: absolute;
	top: 3.7vh;
	left: 50px;
	z-index: 1;
}
body#page #header figure.logo,
body#page #header h1#dopingpanda_logo {
	transform : translate(0, 50px);
	top: 60px;
	left: 60px;
}
#header h1#dopingpanda_logo.in {
	opacity : 1;
	transform : translate(0, 0);
}
body#page #header figure.logo.in,
body#page #header h1#dopingpanda_logo.in {
	opacity : 1;
	transform : translate(0, 0);
}
#header h1#dopingpanda_logo img {
	width: auto;
	height: 92.59vh;
	width: 21.2vw;
	height: auto;
}
body#page #header figure.logo img,
body#page #header h1#dopingpanda_logo img {
	width: 180px;
	height: auto;
}
#header #switch {
	width: 140px;
	position: fixed;
	top: 0;
	right: 0;
	z-index: 30000;
}
#header #switch img.off {
	display: block;
}
#header #switch img.on {
	display: none;
}
#header #switch.active img.off {
	display: none;
}
#header #switch.active img.on {
	display: block;
}


/**
 * ナビゲーション
**/
#main_navi {
	width: 100%;
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 20000;
}
#main_navi .wrap {
	width: 100%;
	height: 100vh;
	background: #000416 url(./img/navi_back_01.png) no-repeat center center;
	background-size: 100% auto;
	position: relative;
}
#main_navi ul {
	position: absolute;
	bottom: 75px;
	right: 95px;
}
#main_navi ul li {
	margin: 0 0 10px 0;
	list-style-type: none;
	line-height:1.1em;
	text-align: right;
	font-size: 60px;
	font-weight: 300;
	font-family: 'Antonio', sans-serif;
}
#main_navi ul li a {
	padding-bottom: 5px;
	color: #fff;
	text-decoration: none;
	display: inline-block;
	position: relative;
	overflow: hidden;
}
#main_navi ul li a:hover {
	color: #000416;
	transition: transform .3s;
}
#main_navi ul li a::before {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 0;
	content: '';
	width: 140%;
	height: 100%;
	background: #fff;
	transform-origin: right top;
	transform: skewX(-30deg) scale(0, 1);
	transition: transform .3s;
}
#main_navi ul li a:hover::before {
	transform-origin: left top;
	transform: skewX(-30deg) scale(1, 1);
}
#main_navi ul li a .text {
	position: relative;
	z-index: 1;
}

#navi {
	position: absolute;
	top: 14.8vh;
	left: 28.5vw;
	line-height: 1.1em;
	font-size: 2.525vw;
	font-weight: 300;
	font-family: 'Antonio', sans-serif;
	text-align: left;
	color: #fff;
	transform: rotate( 90deg );
	transform-origin: left top;
}

#navi ul {
	overflow: hidden;
}

#navi ul li {
	list-style-type: none;
	margin: 0 0 0 0.78vw;
	float: left;
	position: relative;
}

#navi ul li a {
	color: #fff;
	text-decoration: none;
	display: block;

}
#navi ul li a:hover {
	color: #4a5261;
}

#navi ul li a ,
#navi ul li a::after {
	animation-delay: var(--animation-delay, 2s);
	animation-iteration-count: var(--iterations, 1);
	animation-duration: var(--duration, 800ms);
	animation-fill-mode: both;
	animation-timing-function: cubic-bezier(0.0, 0.0, 0.2, 1);
	transition: 0.3s;
}

#navi ul li a {
	--animation-delay: var(--delay, 0);
	--animation-duration: var(--duration, 800ms);
	--animation-iterations: var(--iterations, 1);
	position: relative;
	animation-name: clip-text;
	white-space: nowrap;
/*	cursor: default;*/
}

#navi ul li a::after {
	content: "";
	position: absolute;
	z-index: 999;
/*		top: 0;*/
	left: 0;
/*		right: 0;*/
	bottom: 0;
	background-color: #E30083;
/*		transform: scaleY(0);*/
/*		transform-origin: 0 0;*/
/*		pointer-events: none;*/
	animation-name: text-revealer;
	width: 100%;
	height: 0;
}

#index_logobox {
	display: flex;
	flex-direction: column;
	width: 45vw;
	min-width: 495px;
	max-width: 690px;
	margin: auto;
	position: absolute;
	bottom: 50px;
	left: 0;
	right: 0;

}
#index_logobox h1 {
	order: 2;
}
#index_logobox h1 img {
	width: 100%;
	height: auto;
}
#dpnavi {
	order: 1;
}
#dpnavi ul {
	display: flex;
	justify-content: space-around;
	overflow: hidden;
	font-size:0;
	text-align: center;
	margin: 0 0 1.2vw;
}
#dpnavi ul li {
	color: #fff;
	font-size: 26px;
	font-weight: 300;
	font-family:
		'Antonio',
		sans-serif;
	text-align: center;
	line-height: 1.1em;
	list-style-type: none;
	position: relative;
}

#dpnavi ul li a {
	color: #fff;
	text-decoration: none;
	display: block;

}
#dpnavi ul li a:hover {
	color: #4a5261;
}

#dpnavi ul li a ,
#dpnavi ul li a::after {
	animation-delay: var(--animation-delay, 2s);
	animation-iteration-count: var(--iterations, 1);
	animation-duration: var(--duration, 800ms);
	animation-fill-mode: both;
	animation-timing-function: cubic-bezier(0.0, 0.0, 0.2, 1);
	transition: 0.3s;
}

#dpnavi ul li a {
	--animation-delay: var(--delay, 0);
	--animation-duration: var(--duration, 800ms);
	--animation-iterations: var(--iterations, 1);
	position: relative;
	animation-name: clip-text;
	white-space: nowrap;
/*	cursor: default;*/
}

#dpnavi ul li a::after {
	content: "";
	position: absolute;
	z-index: 999;
	left: 0;
	bottom: 0;
	background-color: #fff;
	animation-name: text-revealer;
	width: 100%;
	height: 0;
}

@keyframes clip-text {
	from {
		clip-path: inset(100% 0 0 0);
	}
	to {
		clip-path: inset(0 0 0 0);
	}
}

@keyframes text-revealer {
	/*
	0%, 50% {
		transform-origin: 0 0;
	}
	
	60%, 100% {
		transform-origin: 0 0;	 
	}*/
	60% {
/*		transform: scaleY(1);*/
		width: 100%;
		height: 100%;
		bottom: 0;
	}
	100% {
/*		transform: scaleY(0);*/
/*		height: 0;*/
		width: 100%;
		bottom: 100%;
	}
}

/**
 * メインイメージ
**/
#main_image {
	width: 100%;
/*	min-width: 1200px;*/
	height: 100vh;
	text-align: left;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 0;
	background: url(./img/main_image_2025_02.webp) right top no-repeat;
	background-size: cover;
}

pc_disp
/**
 * コンテンツ
**/

#content {
	background: url(./img/content_back_02.png) no-repeat center bottom;
	background-size: 100% 70%;
	overflow: hidden;
	display: block;
	position: relative;
	z-index: 1;
}

body#page #content {
	background: none;
}

#content img {
	width: 100%;
	height: auto;
}


/**
 * SNSコンテンツ
**/
#sns_contents {
	padding: 0 0 0 0;
	width: 100%;
	text-align: center;
	color: #fff;
	background: #000416;
	position: relative;
	z-index: 1;
}
#sns_contents .wrap {
	margin: 0 auto;
	padding: 100px 0;
	width: 92%;
	max-width: 1200px;
	min-width: 1160px;
	text-align: left;
	position: relative;
}
#sns_contents .wrap .line01 {
	width: 185px;
	height: 180px;
	overflow: hidden;
	position: absolute;
	top: -140px;
	right: -35px;
}
#sns_contents .wrap .line01 img {
	transform : translate(185px, -160px);
}
#sns_contents .wrap .line01 img.in {
	transform : translate(0, 0);
	transition:all 0.5s ease-in-out;
}
#sns_contents .wrap .line02 {
	width: 108px;
	height: 100px;
	overflow: hidden;
	position: absolute;
	top: -152px;
	right: -90px;
}
#sns_contents .wrap .line02 img {
	transform : translate(108px, -100px);
}
#sns_contents .wrap .line02 img.in {
	transform : translate(0, 0);
	transition:all 0.5s ease-in-out;
	transition-delay: 0.3s;
}



#sns_contents .wrap .left {
	width: 48.33%;
	max-width: 580px;
	position: relative;
	float: left;
}
#sns_contents .wrap .right {
	width: 48.33%;
	max-width: 580px;
	position: relative;
	float: right;
}
#sns_contents .wrap h3 {
	line-height: 1em;
	font-size: 72px;
	font-weight: 300;
	font-family: 'Antonio', sans-serif;
	text-align: left;
	position: absolute;
	top: 0;
	left: 1.22em;
	transform: rotate( 90deg );
	transform-origin: left top;
}
#sns_contents .wrap .right h3 {
	top: -4px;
}
#sns_contents .wrap .box {
	margin: 0 0 0 100px;
/*	float: right; */
}

/* twitter */
#sns_contents .wrap .left .box  {
	width: 460px;
	height: 463px;
	position: relative;
}
#sns_contents .wrap .left .box iframe {
	width: 100% !important;
	height: 463px !important;
	margin: auto;
	position: absolute !important;
	top:  0;
	bottom: 0;
	left: 0;
	right: 0;
}

/* Instagram */
#sns_contents .wrap .right .box#insta_box  {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	justify-content: flex-start;
	gap: 13px 13px;
	width: 460px;	
	overflow: hidden;
}
.insta_post {
	width: 140px;
	margin: 0;
}
.insta_post a {
	display: block;
	overflow: hidden;
}

/**
 * フッター
**/
#footer {
	padding: 0 0 0 0;
	width: 100%;
	text-align: center;
	color: #fff;
	background: #000416;
/*	border-top: 1px solid #fff;*/
	overflow: hidden;
	position: relative;
	z-index: 1;
}
#footer img {
	width: 100%;
	height: auto;
	display: block;
}
#footer a {
	color: #fff;
	text-decoration: none;
	transition: 0.3s;
}
#footer .wrap {
	margin: 0 auto;
	padding: 100px 0 95px 0;
	width: 92%;
	max-width: 1200px;
	min-width: 1160px;
	text-align: left;
	overflow: hidden;
}
#footer .wrap .logo {
	margin: 0 7.91% 0 0;
	width: 20%;
	max-width: 240px;
	float: left;
}
#footer .wrap .box {
	overflow: hidden;
}
#footer .wrap .box .footer_navi {
	overflow: hidden;
}
#footer .wrap .box .footer_navi ul {
	overflow: hidden;
	float: left;
}
#footer .wrap .box .footer_navi ul li {
	font-size: 34px;
	font-family: 'Antonio', sans-serif;
	font-weight: 300;
	line-height: 1.2em;
	list-style-type: none;
	margin: 0 0 0 18px;
	float: left;
}
#footer .wrap .box .footer_navi ul li:nth-of-type(1) {
	margin: 0 0 0 0;
}
#footer .wrap .box .footer_navi ul li a:hover {
	opacity: 0.3;
}
#footer .wrap .box .footer_navi ul#footer_navi02 li {
	font-size: 28px;
}
#footer .wrap .box .footer_navi ul#footer_navi02 li a {
	text-decoration: underline;
}
#footer .wrap .box .footer_navi ul.sns {
	overflow: hidden;
	float: left;
}
#footer .wrap .box .footer_navi ul.sns li {
	margin: 12px 0 0 30px;
	width: 24px;
	float: left;
}
#footer .wrap .box .footer_navi ul.sns li:nth-of-type(1) {
	margin: 12px 0 0 30px;
}

#footer .wrap .box #copyright {
	padding: 10px 0 0 0;
	line-height: 1.4em;
	font-size: 12px;
	font-weight: normal;
	font-family: Arial, Helvetica, sans-serif;
	font-family: 'Roboto', sans-serif;
	color: #666666;
	clear: both;
}


/**
 * SCROLL DOWN
**/
#scroll {
	width: 18px;
	text-decoration: none;
	color: #fff;
	padding: 5px;
	position: fixed;
	top: calc(50% + 60px);
	right: 35px;
	z-index: 10001;
}
#scroll img {
	margin-top: 6em;
	width: 100%;
	height: auto;
	display: block;
}
#scroll .text {
	display: block;
	width: 8em;
	line-height: 1.1em;
	letter-spacing: 1px;
	font-weight: 300;
	font-family: 'Antonio', sans-serif;
	font-size: 14px;
	padding: 0 90px 0 0;
	transform: rotate( 90deg );
	transform-origin: left top;
	position: absolute;
	top: 0em;
	left: 1.5em;
	background: url(./img/icon_arrow2r.png) right center no-repeat;
}

/**
 * PAGE TOP
**/
#pagetop {
	width: 18px;
	text-decoration: none;
	color: #fff;
	padding: 5px;
	position: fixed;
	bottom: 120px;
	right: 35px;
	z-index: 10001;
	display: none;
}
.home #pagetop {
	color: #e0e0e0;
}
#pagetop img {
	margin-bottom: 2.5em;
	width: 100%;
	height: auto;
	display: block;
}
.home #pagetop img {
	filter: brightness(0.8);
}
#pagetop .text {
	display: block;
	width: 8em;
	line-height: 1.1em;
	letter-spacing: 1px;
	font-weight: 300;
	font-family: 'Antonio', sans-serif;
	font-size: 14px;
	padding: 0 0 0 80px;
	transform: rotate( 90deg );
	transform-origin: left top;
	background: url(./img/icon_arrow2l.png) left 8px no-repeat;
	position: absolute;
	bottom: 4em;
	left: 1.5em;
}



/**
 * サイドSNSリンク
**/
#side_sns {
	margin: -47px 0 0 0;
	width: 18px;
	height: 94px;
	position: fixed;
	top: 50%;
	right: 40px;
	z-index: 100001;
}
#side_sns img {
	width: 100%;
	height: auto;
	display: block;
}
#side_sns ul {
	overflow: hidden;
}
#side_sns ul li {
	margin: 0 0 20px 0;
	float: left;
	clear: both;
}
#side_sns ul li:nth-of-type(3) {
	margin: 0 0 0 0;
}
#side_sns ul li.w a img.w {
	display: block;
}
#side_sns ul li.w a img.b {
	display: none;
}
#side_sns ul li.b a img.w {
	display: none;
}
#side_sns ul li.b a img.b {
	display: block;
}



/**
 *
 * コンテンツ
 *
**/


/**
 * fade in
**/
.fadein {
	opacity : 0;
	transform : translate(0, 50px);
	transition:all 0.5s;
}
.fadein.scrollin {
	opacity : 1;
	transform : translate(0, 0);
}


/**
 * backimage_wrap
**/
.backimage_wrap {
	padding: 100px 0 0 0;
	background: url(./img/content_back_01light.png) center top repeat-y;
	background-size: cover;
	overflow: hidden;
}

/**
 * news
**/
.news {
	margin: 110px 0 0 0;
}
.news .wrap {
	margin: 0 auto 0;
	padding: 0 0 0 120px;
	width: 92%;
	max-width: 1200px;
	text-align: left;
	box-sizing: border-box;
	position: relative;
}
.news .wrap h3 {
	line-height: 1em;
	font-size: 72px;
	font-weight: 300;
	font-family: 'Antonio', sans-serif;
	text-align: left;
	color: #fff;
	position: absolute;
	top: 0;
	left: 1em;
	transform: rotate( 90deg );
	transform-origin: left top;
}
ul.archive_list,
.news .wrap ul {
	margin: 0 0 40px 0;
	position: relative;
	top: -20px;
}
ul.archive_list li,
.news .wrap ul li {
	border-bottom: 1px solid rgba(255,255,255,0.2);
	list-style-type: none;
}
ul.archive_list li a,
.news .wrap ul li a {
	padding: 27px 0 24px;
	text-decoration: none;
	display: block;
	overflow: hidden;
	position: relative;
	transition: 0.6s;
}
ul.archive_list li a:hover,
.news .wrap ul li a:hover {
	background: rgba(0,0,0,0.3);
	transition: 0.3s;
}
/*.news .wrap ul li:nth-of-type(1) a {
	padding: 7px 0 24px;
}*/
ul.archive_list li a:after,
.news .wrap ul li a:after {
	margin: -3px 0 0 0;
	width: 20px;
	height: 6px;
	line-height: 6px;
	content: "";
	background: url(./img/arrow_02.png) no-repeat center center;
	background-size: cover;
	position: absolute;
	top: 50%;
	right: 20px;
}
ul.archive_list li a .update,
.news .wrap ul li a .update {
	margin: 0 15px 0 0;
	width: 90px;
	line-height: 1.4em;
	text-align: right;
	font-size: 16px;
	font-weight: 300;
	font-family: 'Antonio', sans-serif;
	color: #666666;
	float: left;
}
ul.archive_list li a .title,
.news .wrap ul li a .title {
	line-height: 1.4em;
	font-size: 16px;
	color: #fff;
	padding: 0 40px 0 0;
	overflow: hidden;
	box-sizing: border-box;
}
.news .wrap .link {
	margin: 0 auto;
	max-width: 280px;
}
.news .wrap .link a {
	padding: 7px 10px 10px 10px;
	line-height: 1.02em;
	text-align: center;
	text-decoration: none;
	font-size: 20px;
	font-weight: 300;
	font-family: 'Antonio', sans-serif;
	color: #fff;
	border: 2px solid #fff;
	display: block;
	position: relative;
	overflow: hidden;
}
.news .wrap .link a:hover {
	color: #000;
}



/**
 * video box
**/
.video_box {
	width: 92%;
/*	padding-top: 56.25%;*/
	max-width: 1200px;
	aspect-ratio: 16 / 9;
	margin: 0 auto 105px;
	text-align: left;
	position: relative;
}
.video_box iframe {
	position: absolute;
	top: 0;
	right: 0;
	width: 100% !important;
	height: 100% !important;
}


/**
 * live info
**/
.live_info {
}
.live_info .wrap {
	width: 92%;
	max-width: 1200px;
	margin: 0 auto 100px;
	padding: 0 0 0 120px;
	text-align: left;
	box-sizing: border-box;
	position: relative;
}
.live_info .wrap h3 {
	line-height: 1em;
	font-size: 72px;
	font-weight: 300;
	font-family: 'Antonio', sans-serif;
	text-align: left;
	position: absolute;
	top: 0;
	left: 1em;
	transform: rotate( 90deg );
	transform-origin: left top;
}
.live_info .wrap ul {
	min-height: 250px;
	margin: 0 0 40px 0;
}
.live_info .wrap ul li {
	list-style-type: none;
	border-bottom: 1px solid #000416;
}
.live_info .wrap ul li a {
	padding: 27px 0 24px;
	text-decoration: none;
	display: block;
	overflow: hidden;
	position: relative;
}
.live_info .wrap ul li:nth-of-type(1) a {
	padding: 7px 0 24px;
}
.live_info .wrap ul li a:after {
	margin: -3px 0 0 0;
	width: 20px;
	height: 6px;
	line-height: 6px;
	content: "";
	background: url(./img/arrow_01.png) no-repeat center center;
	background-size: cover;
	position: absolute;
	top: 50%;
	right: 20px;
}
.live_info .wrap ul li a .update {
	margin: 0 15px 0 0;
	width: 90px;
	line-height: 1.4em;
	text-align: right;
	font-size: 16px;
	font-weight: 300;
	font-family: 'Antonio', sans-serif;
	color: #666666;
	float: left;
}
.live_info .wrap ul li a .title {
	line-height: 1.4em;
	font-size: 16px;
	color: #000416;
	overflow: hidden;
}
.live_info .wrap .link {
	margin: 0 auto;
	max-width: 280px;
}
.live_info .wrap .link a {
	padding: 7px 10px 10px 10px;
	line-height: 1.02em;
	text-align: center;
	text-decoration: none;
	font-size: 20px;
	font-weight: 300;
	font-family: 'Antonio', sans-serif;
	color: #000;
	border: 2px solid #000;
	display: block;
	position: relative;
	z-index: 1;
	overflow: hidden;
}
.live_info .wrap .link a:hover {
	color: #fff;
}


/**
 * TOP discography
**/
.top_discography {
	margin: 0 0 120px 0;
	width: 100%;
	background: url(./img/discography_back_02.png) right top no-repeat;
	background-size: auto 100%;
	background-position: calc(100% - 10vw) top;
}
.top_discography .wrap {
	margin: 0 auto 0;
	padding: 80px 0 0 120px;
	width: 92%;
	max-width: 1200px;
	text-align: left;
	box-sizing: border-box;
	position: relative;
}
.top_discography .wrap .line01 {
	width: 130px;
	height: 120px;
	overflow: hidden;
	position: absolute;
	top: -158px;
	left: -145px;
}
.top_discography .wrap .line01 img {
	transform : translate(130px, -120px);
}
.top_discography .wrap .line01 img.in {
	transform : translate(0, 0);
	transition:all 0.5s ease-in-out;
}
.top_discography .wrap .line02 {
	width: 195px;
	height: 180px;
	overflow: hidden;
	position: absolute;
	top: -95px;
	left: -165px;
}
.top_discography .wrap .line02 img {
	transform : translate(195px, -175px);
}
.top_discography .wrap .line02 img.in {
	transform : translate(0, 0);
	transition:all 0.5s ease-in-out;
	transition-delay: 0.3s;
}
.top_discography .wrap .line03 {
	width: 108px;
	height: 100px;
	overflow: hidden;
	position: absolute;
	top: -127px;
	left: 3px;
}
.top_discography .wrap .line03 img {
	transform : translate(108px, -100px);
}
.top_discography .wrap .line03 img.in {
	transform : translate(0, 0);
	transition:all 0.5s ease-in-out;
	transition-delay: 0.6s;
}


.top_discography .wrap h3 {
	line-height: 1em;
	font-size: 72px;
	font-weight: 300;
	font-family: 'Antonio', sans-serif;
	color: #fff;
	text-align: left;
	position: absolute;
	top: 80px;
	left: 1em;
	transform: rotate( 90deg );
	transform-origin: left top;
}
.top_discography .wrap ul {
	margin: 0 0 40px 0;
	padding: 60px;
	width: 100vw;
	background: #fff;
	border: 1px solid #000416;
	box-sizing: border-box;
}
.top_discography .wrap ul li {
/*	width: 300px;*/
	font-family: 'Roboto', sans-serif;
/*	float: left;*/
}
.top_discography .wrap ul li .image {
	margin: 0 30px 20px 0;
	width: 300px;
}
.top_discography .wrap ul li .name {
	margin: 0 30px 0 0;
	line-height: 1.4em;
	font-size: 16px;
	font-weight: 500;
}
.top_discography .wrap ul li .name a {
	text-decoration: none;
	color: #000416;
}
.top_discography .wrap ul li .release {
	margin: 0 30px 0 0;
	line-height: 1.4em;
	font-size: 12px;
	color: #666666;
}
.top_discography .wrap .link {
	margin: 0 auto 40px;
	max-width: 280px;
}
.top_discography .wrap .link a {
	padding: 7px 10px 10px 10px;
	line-height: 1.02em;
	text-align: center;
	text-decoration: none;
	font-size: 20px;
	color: #000;
	font-weight: 300;
	font-family: 'Antonio', sans-serif;
	border: 2px solid #000;
	display: block;
	position: relative;
	z-index: 1;
	overflow: hidden;
}
.top_discography .wrap .link a:hover {
	color: #fff;
}



/**
 * music video
**/
.music_video {
}
.music_video .wrap {
	margin: 0 auto 100px;
	padding: 0 0 100px 120px;
	width: 92%;
	max-width: 1200px;
	text-align: left;
	box-sizing: border-box;
	position: relative;
}
.music_video .wrap h3 {
	line-height: 1em;
	font-size: 72px;
	font-weight: 300;
	font-family: 'Antonio', sans-serif;
	text-align: left;
	position: absolute;
	top: 0;
	left: 1em;
	transform: rotate( 90deg );
	transform-origin: left top;
}
.music_video .wrap ul {
}
.music_video .wrap ul li {
	margin: 0 0 35px 0;
	list-style-type: none;
	width: 48.14%;
	max-width: 520px;
	font-family: 'Roboto', sans-serif;
	float: left;
}
.music_video .wrap ul li:nth-of-type(2n) {
	float: right;
}
.music_video .wrap ul li:nth-of-type(2n+1) {
	clear: both;
}
.music_video .wrap ul li .video {
	margin: 0 0 16px 0;
	width: 100%;
	position: relative;
	padding-top: 56.25%;
}
.music_video .wrap ul li .video iframe {
	position: absolute;
	top: 0;
	right: 0;
	width: 100% !important;
	height: 100% !important;
}
.music_video .wrap ul li .name {
	line-height: 1.4em;
	font-size: 16px;
	font-weight: 500;
}
.music_video .wrap ul li .name a {
	text-decoration: none;
	color: #000416;
}
.music_video .wrap ul li .release {
	line-height: 1.4em;
	font-size: 12px;
	color: #666666;
}
.music_video .wrap .link {
	margin: 0 auto;
	max-width: 280px;
}
.music_video .wrap .link a {
	padding: 7px 10px 10px 10px;
	line-height: 1.02em;
	text-align: center;
	text-decoration: none;
	font-size: 20px;
	font-weight: 300;
	font-family: 'Antonio', sans-serif;
	color: #000;
	border: 2px solid #000;
	display: block;
	position: relative;
	z-index: 1;
	overflow: hidden;
}
.music_video .wrap .link a:hover {
	color: #fff;
}

.second_level .music_video .wrap ul {
	max-width: 1080px;
	margin: 0 0 0 auto;
}
.second_level .music_video .wrap ul li .name,
.second_level .music_video .wrap ul li .name a {
	color: #fff;
}

/* second level  */
.second_level {
	margin: 200px 0 0 0;
}
.second_level .wrap {
	margin: 0 auto 290px;
	padding: 0 0 0 0;
	width: 92%;
	max-width: 1200px;
	text-align: left;
	box-sizing: border-box;
	position: relative;
}
.second_level .wrap .description {
	min-height: 3em;
	margin: 0 0 90px 120px;
	line-height: 2em;
	font-size: 14px;
	text-align: left;
	color: #fff;
	overflow: hidden;
}
.second_level .link {
	margin: 0 auto;
	max-width: 280px;
}
.second_level .wrap .link a {
	display: block;
	color: #fff;
	font-size: 20px;
	font-weight: 300;
	font-family: 'Antonio', sans-serif;
	line-height: 1.02em;
	text-align: center;
	text-decoration: none;
	border: 2px solid #fff;
	padding: 7px 10px 10px 10px;
	margin: 0 0 5px;
	position: relative;
	z-index: 1;
	overflow: hidden;
	transition: 0.3s;
}
.second_level .wrap .link a:hover {
	color: #000;
}
.second_level article {
}
.second_level article a {
	color: #39f;
}
.home .new_release ul,
.home .new_release ol,
.second_level article ul,
.second_level article ol {
	padding: 0 0 0 2em;
}
.home .new_release ol li,
.second_level article ol li {
	list-style: decimal-leading-zero;
}
/**
 * article
**/

article {
}



/**
 * entry
**/
.entry_title {
	color: #fff;
	margin: 0 0 0 0;
	line-height: 1.2em;
	font-size: 40px;
	font-weight: 300;
	font-family: 'Antonio', sans-serif;
}
.entry_title span {
	font-size: 0.6em;
}
.entry_meta {
	color: #fff;
	margin: 0 0 15px 0;
	line-height: 1.4em;
	font-family: 'Antonio', sans-serif;
	font-weight: 300;
	font-family: 'Antonio', sans-serif;
}


/* profile */
.profile {
}
.page_title01 {
	line-height: 1em;
	font-size: 72px;
	font-weight: 300;
	font-family: 'Antonio', sans-serif;
	text-align: left;
	color: #fff;
	position: absolute;
	top: 0;
	left: 1em;
	transform: rotate( 90deg );
	transform-origin: left top;
}
.page_title01 a {
	color: #fff;
	text-decoration: none;
}

.profile .wrap .description p {
	margin: 0 0 20px 0;
}
.profile .wrap ul {
	display: flex;
	overflow: hidden;
}

.profile .wrap ul li {
	margin: 0 5% 0 0;
	width: 30%;
	max-width: 360px;
	line-height: 1.2em;
	font-size: 14px;
	font-weight: normal;
	font-family: 'Roboto', sans-serif;
	color: #fff;
	position: relative;
	overflow: hidden;
}
.profile .wrap ul li:after {
	width: 100%;
	height: 0;
	line-height: 0;
	content: "";
	border-top: 1px solid #4d4d4d;
	position: absolute;
	bottom: 0.7em;
	right: 66px;
	z-index: 0;
}
.profile .wrap ul li:nth-of-type(1) {
	order: 2;
}
.profile .wrap ul li:nth-of-type(2) {
	order: 1;
}
.profile .wrap ul li:nth-of-type(3) {
	order: 3;
}

.profile .wrap ul li:nth-of-type(3) {
	margin: 0 0 0 0;
}
.profile .wrap ul li .image {
	margin: 0 0 40px 0;
}
.profile .wrap ul li .instagram {
	width: 18px;
	position: absolute;
	bottom: 3px;
	right: 0;
}
.profile .wrap ul li .twitter {
	width: 18px;
	position: absolute;
	bottom: 3px;
	right: 26px;
}
.profile .wrap ul li p {
	margin: 0 66px 0 0;
	padding: 0 15px 0 0;
	background: #000416;
	position: relative;
	z-index: 1;
	display: inline-block;
}
.profile .wrap ul li p .name {
	line-height: 1.2em;
	font-size: 20px;
	font-weight: bold;
}

.profile .wrap .line01 {
	width: 130px;
	height: 120px;
	overflow: hidden;
	position: absolute;
	top: 25px;
	right: -47px;
}
.profile .wrap .line01 img {
	transform : translate(130px, -120px);
}
.profile .wrap .line01 img.in {
	transform : translate(0, 0);
	transition:all 0.5s ease-in-out;
}
.profile .wrap .line02 {
	width: 195px;
	height: 180px;
	overflow: hidden;
	position: absolute;
	top: 75px;
	right: -80px;
}
.profile .wrap .line02 img {
	transform : translate(195px, -175px);
}
.profile .wrap .line02 img.in {
	transform : translate(0, 0);
	transition:all 0.5s ease-in-out;
	transition-delay: 0.3s;
}
.profile .wrap .line03 {
	width: 108px;
	height: 100px;
	overflow: hidden;
	position: absolute;
	top: 47px;
	right: -140px;
}
.profile .wrap .line03 img {
	transform : translate(108px, -100px);
}
.profile .wrap .line03 img.in {
	transform : translate(0, 0);
	transition:all 0.5s ease-in-out;
	transition-delay: 0.6s;
}
.profile .wrap .line04 {
	width: 185px;
	height: 180px;
	overflow: hidden;
	position: absolute;
	top: 430px;
	left: -305px;
}
.profile .wrap .line04 img {
	transform : translate(185px, -160px);
}
.profile .wrap .line04 img.in {
	transform : translate(0, 0);
	transition:all 0.5s ease-in-out;
}
.profile .wrap .line05 {
	width: 108px;
	height: 100px;
	overflow: hidden;
	position: absolute;
	top: 424px;
	left: -190px;
}
.profile .wrap .line05 img {
	transform : translate(108px, -100px);
}
.profile .wrap .line05 img.in {
	transform : translate(0, 0);
	transition:all 0.5s ease-in-out;
	transition-delay: 0.3s;
}
.profile .wrap .line06 {
	width: 195px;
	height: 180px;
	overflow: hidden;
	position: absolute;
	bottom: -245px;
	right: -195px;
}
.profile .wrap .line06 img {
	transform : translate(195px, -180px);
}
.profile .wrap .line06 img.in {
	transform : translate(0, 0);
	transition:all 0.5s ease-in-out;
}
.profile .wrap .line07 {
	width: 130px;
	height: 120px;
	overflow: hidden;
	position: absolute;
	bottom: -123px;
	right: -235px;
}
.profile .wrap .line07 img {
	transform : translate(130px, -120px);
}
.profile .wrap .line07 img.in {
	transform : translate(0, 0);
	transition:all 0.5s ease-in-out;
	transition-delay: 0.3s;
}

/* ラッパー全体：画面を覆う（クリック透過） */
#line-container {
	position:fixed;      /* スクロールしても追従 */
	inset:0;
	pointer-events:none;
	z-index:-1;          /* 背景扱い。必要なら調整 */
	overflow:hidden;
}

/* 各ラインの共通スタイル */
.diag-line {
	position:absolute;
	background: rgba(255,255,255,0.4);   /* 色は自由に */
	transform-origin:left top;          /* 左上を基点に回転 */
	transform:rotate(45deg);            /* 45°固定 */
}

/* 45°に回しつつ左下へ移動 */
@keyframes slide45 {
	0%   {transform:translate(0,0)        rotate(-45deg);}
	100%{transform:translate(-150vmax,150vmax) rotate(-45deg);}
}


/**
 * DISCOGRAPHY / disc_info 
**/
.disc_info {
	width: 92%;
	max-width: 1200px;
	text-align: left;
	margin: 0 auto 100px;
	padding: 60px;
	background: #fff;
	border: 1px solid #000416;
	box-sizing: border-box;
	position: relative;
}
.disc_info.new_release article::before {
	width: 160px;
	height: 144px;
	content: "";
	background: transparent url(./img/label_02.png) no-repeat 0 0;
	background-size: 160px auto;
	position: absolute;
	left: 0;
	top: 0;
	z-index: 3;
}
.disc_info h2 {
	color: #000416;
	line-height: 1.2em;
	font-size: 32px;
	font-weight: 300;
	font-family: 'Antonio', sans-serif;
	text-align: center;
	margin: 0 0 20px;
}
.disc_info .line01 {
	width: 195px;
	height: 180px;
	overflow: hidden;
	position: absolute;
	top: 234px;
	right: -100px;
}
.disc_info .line01 img {
	transform : translate(195px, -180px);
}
.disc_info .line01 img.in {
	transform : translate(0, 0);
	transition:all 0.5s ease-in-out;
}
.disc_info .line02 {
	width: 130px;
	height: 120px;
	overflow: hidden;
	position: absolute;
	top: 152px;
	right: -153px;
}
.disc_info .line02 img {
	transform : translate(130px, -120px);
}
.disc_info .line02 img.in {
	transform : translate(0, 0);
	transition:all 0.5s ease-in-out;
	transition-delay: 0.3s;
}

.disc_info article {
	padding: 0 0 40px;
	margin: 0 0 40px;
	border-bottom: 1px dotted #ddd;
}
.disc_info article:last-of-type {
	margin: 0;
	border-bottom: none;
}
.disc_info .image {
	margin: 0 3.3% 0 0;
	width: 35%;
	max-width: 420px;
	float: left;
	z-index: 1;
}
.disc_info .box {
	overflow: hidden;
}
.disc_info .box * {
	color: #000416;
}
.disc_info .box p {
	font-size: 14px;
	line-height: 1.6em;
	margin: 0 0 0.5em;
}
.second_level .disc_info .box h3 {
	font-size: 50px;
}
.second_level .disc_info .box p {
	line-height: 1.6em;
	margin: 0 0 0.5em;
}
.disc_info .box p.new {
	margin: 0 0 0 0;
	line-height: 1.2em;
	font-size: 18px;
	font-weight: 300;
	font-family: 'Antonio', sans-serif;
	color: #E30083;
}
.disc_info .disc_title,
.disc_info .box h3 {
	margin: 0 0 0 0;
	line-height: 1.2em;
	font-size: 62px;
	font-weight: 300;
	font-family: 'Antonio', sans-serif;
	color: #000416;
}

.disc_info .box .release {
	margin: 0 0 15px 0;
	line-height: 1.4em;
	font-size: 32px;
	font-weight: 300;
	font-family: 'Antonio', sans-serif;
	color: #000416;
}
.disc_info .box ul {
	line-height: 1.4em;
	font-size: 14px;
	font-weight: normal;
	font-family: 'Roboto', sans-serif;
	color: #000416;
	margin: 0 0 15px 0;
}
.disc_info .box ol {
	line-height: 1.4em;
	font-size: 14px;
	font-weight: normal;
	font-family: 'Roboto', sans-serif;
	color: #000416;
	margin: 0 0 15px 0;
}
.disc_info .box .price {
	margin: 0 0 15px 0;
	line-height: 1.4em;
	font-size: 14px;
	font-weight: normal;
	font-family: 'Roboto', sans-serif;
	color: #000416;
}
.disc_info .box .link {
	max-width: 280px;
}
.disc_info .box .link a {
	padding: 7px 10px 10px 10px;
	line-height: 1.02em;
	text-align: center;
	text-decoration: none;
	font-size: 20px;
	font-weight: 300;
	font-family: 'Antonio', sans-serif;
	color: #000;
	border: 2px solid #000;
	display: block;
	position: relative;
	z-index: 1;
	overflow: hidden;
}
.disc_info .box .link a:hover {
	color: #fff;
}

/**
 * base link
**/
a.base_link {
	transition: 0.3s !important;
}
a.base_link:hover {
	transition: transform .3s;
}
a.base_link::before {
	position: absolute;
	top: 0;
	left: 0;
	z-index: -1;
	content: '';
	width: 120%;
	height: 102%;
	background: #fff;
	transform-origin: right top;
	transform: skewX(-30deg) scale(0, 1);
	transition: transform .3s;
}
a.base_link:hover::before {
	transform-origin: left top;
	transform: skewX(-30deg) scale(1, 1);
}


.music_video a.base_link::before,
.top_discography a.base_link::before,
.live_info a.base_link::before,
.disc_info a.base_link::before {
	background: #000;
}


/** レスポンシブウェブデザイン用 **/

/**
 * スマートフォン端末用
**/

@media only screen and (max-width: 780px) {
	body {
		padding: 0;
		-webkit-text-size-adjust: none;
		font-size: 12px;
		/*font-family: "Roboto", "Helvetica Neue", Helvetica, Arial, "Noto Sans JP", sans-serif;*/
		font-family: "Roboto", "Helvetica Neue", Helvetica, Arial, "Noto Sans JP", "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", Meiryo, "メイリオ", sans-serif;

	}

	/**
	 * SP表示
	**/
	.sp_disp { display: block !important; }
	.pc_disp { display: none !important; }




	/**
	 * ラッパー
	**/

	#wrapper {
		overflow: hidden;
	}


	/**
	 * ヘッダー
	**/
	#header {
		width: 100%;
		height: 144.26vw;

		text-align: left;
		position: relative;
		z-index: 10000;
	}
	body#page #header {
		height: 0px;
	}
	#header h1#dopingpanda_logo {
		margin: 0 0 0 -40vw;
		width: 80vw;
		opacity : 0;
		transform : translate(0, 50px);
		transition:all 0.5s;
		position: absolute;
		top: 16vw;
		left: 50%;
		z-index: 1;
	}	
	body#page #header figure.logo,
	body#page #header h1#dopingpanda_logo {
		margin: 0 0 0 0;
		width: 26.66vw;
		transform : translate(0, 50px);
		top: 5.3vw;
		left: 5.3vw;
	}
	#header h1#dopingpanda_logo.in {
		opacity : 1;
		transform : translate(0, 0);
	}
	#header h1#dopingpanda_logo img {
		width: 100%;
		height: auto;
	}
	body#page #header figure.logo img,
	body#page #header h1#dopingpanda_logo img {
		width: 100%;
		height: auto;
	}
	#header #switch {
		width: 21.33vw;
		position: fixed;
		top: 0;
		right: 0;
		z-index: 10001;
	}
	#header #switch img.off {
		display: block;
	}
	#header #switch img.on {
		display: none;
	}
	#header #switch.active img.off {
		display: none;
	}
	#header #switch.active img.on {
		display: block;
	}

	#index_logobox {
		width: 80vw;
		max-width: none;
		min-width: auto;
		margin: auto;
		position: absolute;
		top: 50px;
		left: 0;
		right: 0;
		transform: rotate( 0 );
		transform-origin: left top;
		display: block;
	}
	#index_logobox h1 img {
		width: 100%;
		height: auto;
	}

	/**
	 * ナビゲーション
	**/
	#main_navi {
		width: 100%;
		display: none;
		position: fixed;
		top: 0;
		left: 0;
		z-index: 10000;
	}
	#main_navi .wrap {
		width: 100%;
		height: 100vh;
		background: #000416 url(./img/navi_back_01-sp.png) no-repeat center center;
		background-size: auto 100%;
		position: relative;
	}
	#main_navi ul {
		position: absolute;
		bottom: 27.73vw;
		right: 12vw;
	}
	#main_navi ul li {
		margin: 0 0 0.9vw 0;
		line-height:1.1em;
		text-align: right;
		font-size: 12.8vw;
		font-weight: 300;
		font-family: 'Antonio', sans-serif;
	}
	#main_navi ul li a {
		padding-bottom: 5px;
		color: #fff;
		text-decoration: none;
		display: inline-block;
		position: relative;
		overflow: hidden;
	}
	#main_navi ul li a:hover {
		color: #000416;
		transition: transform .3s;
	}
	#main_navi ul li a::before {
		position: absolute;
		top: 0;
		left: 0;
		content: '';
		width: 140%;
		height: 100%;
		background: #fff;
		transform-origin: right top;
		transform: skewX(-30deg) scale(0, 1);
		transition: transform .3s;
	}
	#main_navi ul li a:hover::before {
		transform-origin: left top;
		transform: skewX(-30deg) scale(1, 1);
	}
	#main_navi ul.sns {
		bottom: 13.33vw;
	}
	#main_navi ul.sns li {
		margin: 0 0 0 8vw;
		width: 6.4vw;
		float: left;
	}
	#main_navi ul.sns li a::before {
		display: none;
	}


	#navi {
		position: absolute;
		top: 11vw;
		left: 30.5vw;
		line-height: 1.1em;
		font-size: 2.525vw;
		font-weight: 300;
		font-family: 'Antonio', sans-serif;
		text-align: left;
		color: #fff;
		transform: rotate( 90deg );
		transform-origin: left top;
	}

	#navi ul {
		overflow: hidden;
	}

	#navi ul li {
		margin: 0 0 0 0.78vw;
		float: left;
		position: relative;
	}
	#navi ul li a {
		color: #fff;
		text-decoration: none;
		display: block;
	}
	#navi ul li a:hover {
		opacity: 0.3;
	}

	#navi ul li a ,
	#navi ul li a::after {
		animation-delay: var(--animation-delay, 2s);
		animation-iteration-count: var(--iterations, 1);
		animation-duration: var(--duration, 800ms);
		animation-fill-mode: both;
		animation-timing-function: cubic-bezier(0.0, 0.0, 0.2, 1);
	}

	#navi ul li a {
		--animation-delay: var(--delay, 0);
		--animation-duration: var(--duration, 800ms);
		--animation-iterations: var(--iterations, 1);
		position: relative;
		animation-name: clip-text;
		white-space: nowrap;
	/*	cursor: default;*/
	}

	#navi ul li a::after {
			content: "";
			position: absolute;
			z-index: 999;
	/*		top: 0;*/
			left: 0;
	/*		right: 0;*/
			bottom: 0;
			background-color: #E30083;
	/*		transform: scaleY(0);*/
	/*		transform-origin: 0 0;*/
	/*		pointer-events: none;*/
			animation-name: text-revealer;
			width: 100%;
			height: 0;

	}

	/**
	 * メインイメージ
	**/
	#main_image {
		width: 100%;
		min-width: auto;
		height: 100vh;
		text-align: left;
		background: none;
		position: fixed;
		top: 0;
		left: 0;
		z-index: 0;
		background: url(./img/main_image_2025_mobile.webp) center bottom no-repeat;
		background-size: cover;
	}
	#main_image img {
		position: absolute;
		bottom: 0;
		left: 0;
		z-index: 0;
	}


	/**
	 * コンテンツ
	**/

	#content {
		background-image: url(./img/ccontent_back_01-splight.png),url(./img/content_back_02.png);
		background-repeat: no-repeat, no-repeat;
		background-position: center 266.66vw, center bottom;
		background-size: 100% auto, 100% 70%;
		overflow: hidden;
		display: block;
		position: relative;
		z-index: 1;
	}

	#content img {
		width: 100%;
		height: auto;
	}


	/**
	 * SNSコンテンツ
	**/
	#sns_contents {
		padding: 0 0 0 0;
		width: 100%;
		text-align: center;
		color: #fff;
		background: #000416;
		position: relative;
		z-index: 1;
	}
	#sns_contents .wrap {
		max-width: 780px;
		min-width: auto;
		margin: 0 auto;
		padding: 16vw 0 13.33vw;
		width: 89.6%;
		text-align: left;
		position: relative;
	}
	#sns_contents .wrap .line01 {
		width: 26.13vw;
		height: 23.73vw;
		overflow: hidden;
		position: absolute;
		top: -13.07vw;
		right: 6.13vw;
	}
	#sns_contents .wrap .line01 img {
		transform : translate(26.13vw, -23.73vw);
	}
	#sns_contents .wrap .line01 img.in {
		transform : translate(0, 0);
		transition:all 0.5s ease-in-out;
	}
	#sns_contents .wrap .line02 {
		width: 14.4vw;
		height: 13.33vw;
		overflow: hidden;
		position: absolute;
		top: -13.33vw;
		right: -1.33vw;
	}
	#sns_contents .wrap .line02 img {
		transform : translate(14.4vw, -13.33vw);
	}
	#sns_contents .wrap .line02 img.in {
		transform : translate(0, 0);
		transition:all 0.5s ease-in-out;
		transition-delay: 0.3s;
	}



	#sns_contents .wrap .left {
		margin: 0 0 13.33vw 0;
		width: 100%;
		max-width: 100%;
		position: relative;
		float: none;
		overflow: hidden;
	}
	#sns_contents .wrap .right {
		width: 100%;
		max-width: 100%;
		position: relative;
		float: none;
		overflow: hidden;
	}
	#sns_contents .wrap h3 {
		line-height: 1em;
		font-size: 12.8vw;
		font-weight: 300;
		font-family: 'Antonio', sans-serif;
		text-align: left;
		position: absolute;
		top: 0;
		left: 1em;
		transform: rotate( 90deg );
		transform-origin: left top;
	}

	#sns_contents .wrap .left .box {
		width: calc(100% - 17.33vw);
		margin: 0 0 0 17.33vw;
		float: right; 
	}
	#sns_contents .wrap .right .box#insta_box {
		display: flex;
		width: calc(100% - 17.33vw);
		gap: 10px 5px;
		height: auto;
		float: right; 
	}
	.insta_post {
		width: calc(50% - 15px);
		aspect-ratio: 1 / 1;
		margin: 0 5px 10px;
	}



	/**
	 * フッター
	**/
	#footer {
		padding: 0 0 0 0;
		width: 100%;
		text-align: center;
		color: #fff;
		background: #000416;
		border-top: none;
		overflow: hidden;
		position: relative;
		z-index: 1;
	}
	#footer img {
		width: 100%;
		height: auto;
		display: block;
	}
	#footer a {
		color: #fff;
		text-decoration: none;
	}
	#footer .wrap {
		margin: 0 auto;
		padding: 13.33vw 0 13.33vw 0;
		width: 89.6%;
		max-width: 1200px;
		text-align: left;
		overflow: hidden;
	}
	#footer .wrap .logo {
		margin: 0 auto 13.33vw auto;
		width: 48vw;
		max-width: 48vw;
		float: none;
	}
	#footer .wrap .box {
		overflow: hidden;
	}
	#footer .wrap .box .footer_navi {
		overflow: hidden;
	}
	#footer .wrap .box .footer_navi ul {
		margin: 0 auto 9.33vw auto;
		width: 70vw;
		text-align: center;
		overflow: hidden;
		float: none;
	}
	#footer .wrap .box .footer_navi ul li {
		margin: 0 1.3vw 4vw;
		line-height: 1.2em;
		font-size: 6.4vw;
		font-family: 'Antonio', sans-serif;
		font-weight: 300;
		display: inline-block;
		float: none;
	}
	#footer .wrap .box .footer_navi ul li:nth-of-type(1) {
		margin: 0 1.3vw 4vw;
	}
	#footer .wrap .box .footer_navi ul li a:hover {
		opacity: 0.3;
	}
	#footer .wrap .box .footer_navi ul.sns {
		width: 100%;
		text-align: center;
		overflow: hidden;
		float: none;
	}
	#footer .wrap .box .footer_navi ul.sns li {
		width: 6.4vw;
		float: none;
		display: inline-block;
		margin: 0 4vw;
	}
	#footer .wrap .box .footer_navi ul.sns li:nth-of-type(1) {
		margin: 1vw 4vw 0;
	}
	#footer .wrap .box #copyright {
		padding: 13.33vw 0 0 0;
		line-height: 1.4em;
		font-size: 3.2vw;
		font-weight: normal;
		font-family: Arial, Helvetica, sans-serif;
		font-family: 'Roboto', sans-serif;
		color: #666666;
		text-align: center;
		clear: both;
	}

	/**
	 * PAGE TOP
	**/
	#pagetop {
		width: 4.26vw;
		position: fixed;
		bottom: 35px;
		right: 5.33vw;
		z-index: 100;
		display: none;
	}
	#pagetop img {
		width: 100%;
		height: auto;
		display: block;
	}
	#pagetop .text {
		width: 8em;
		line-height: 1.1em;
		letter-spacing: 1px;
		font-weight: 300;
		font-family: 'Antonio', sans-serif;
		font-size: 3.2vw;
		display: block;
		transform: rotate( 90deg );
		transform-origin: left top;
		position: absolute;
		bottom: 4em;
		left: 1.5em;
	}

	/**
	 * SCROLL DOWN
	**/
	#scroll {
		display: none !important;
	}

		

	/**
	 * fade in
	**/
	.fadein {
		opacity : 0;
		transform : translate(0, 50px);
		transition:all 0.5s;
	}
	.fadein.scrollin {
		opacity : 1;
		transform : translate(0, 0);
	}

/**
 * backimage_wrap
**/
.backimage_wrap {
	padding: 13.33vw 0 0 0;
	background: none;
	overflow: hidden;
}

	/**
	 * news
	**/
	.news {
		margin: 14.66vw 0 0 0;
	}
	.news .wrap {
		margin: 0 auto 0;
		margin: 0 auto 13.33vw;
		padding: 0 0 0 0;
		width: 89.6%;
		max-width: 1200px;
		text-align: left;
		box-sizing: border-box;
		position: relative;
	}
	.news .wrap h3 {
		line-height: 1em;
		font-size: 12.8vw;
		font-weight: 300;
		font-family: 'Antonio', sans-serif;
		text-align: left;
		color: #fff;
		position: absolute;
		top: 0;
		left: 1em;
		transform: rotate( 90deg );
		transform-origin: left top;
	}
	.news .wrap ul {
		margin: 0 0 3.33vw 17.33vw;
	}
	.news .wrap ul li {
		border-bottom: 1px solid rgba(255,255,255,0.2);
	}
	.news .wrap ul li a {
		padding: 2.6vw 15px 2.6vw 0;
		text-decoration: none;
		display: block;
		overflow: hidden;
		position: relative;
	}
	.news .wrap ul li a:after {
		margin: -1px 0 0 0;
		width: 10px;
		height: 3px;
		line-height: 6px;
		content: "";
		background: url(./img/arrow_02.png) no-repeat center center;
		background-size: cover;
		position: absolute;
		top: 50%;
		right: 0px;
	}
	.news .wrap ul li a .update {
		width: 100%;
		color: #aaa;
		font-size: 3.73vw;
		font-weight: 300;
		font-family: 'Antonio', sans-serif;
		line-height: 1.6em;
		text-align: left;
		margin: 0 15px 0 0;
		float: none;
	}
	.news .wrap ul li a .title {
		line-height: 1.4em;
		font-size: 3.73vw;
		color: #fff;
		padding: 0;
		overflow: hidden;
	}
	.news .wrap .link {
		margin: 0 auto;
		max-width: 68vw;
	}
	.news .wrap .link a {
		display: block;
		color: #fff;
		text-align: center;
		text-decoration: none;
		font-size: 5.33vw;
		font-weight: 300;
		font-family: 'Antonio', sans-serif;
		line-height: 1.2em;
		border: 2px solid #fff;
		padding: 0.58vw 0.9vw 0.9vw 0.9vw;
		position: relative;
		overflow: hidden;
	}
	.news .wrap .link a:hover {
		color: #fff;
	}


	/**
	 * new release
	**/
	.disc_info {
		margin: 0 auto 13.33vw;
		padding: 10.6vw 7.2vw 9.6vw;
		width: 89.6%;
		max-width: 1200px;
		text-align: left;
		background: #fff;
		border: 1px solid #000416;
		box-sizing: border-box;
		position: relative;
	}
	.disc_info.new_release {
		background: #fff url(./img/label_01.png) no-repeat 0 0;
		background-size: 27.2vw auto;
	}
	.disc_info .line01 {
		width: 26.13vw;
		height: 24.53vw;
		overflow: hidden;
		position: absolute;
		top: auto;
		bottom: 15.2vw;
		right: 3.46vw;
	}
	.disc_info .line01 img {
		transform : translate(26.13vw, -24.53vw);
	}
	.disc_info .line01 img.in {
		transform : translate(0, 0);
		transition:all 0.5s ease-in-out;
	}
	.disc_info .line02 {
		width: 17.33vw;
		height: 16.53vw;
		overflow: hidden;
		position: absolute;
		top: auto;
		bottom: 34.66vw;
		right: -3.73vw;
	}
	.disc_info .line02 img {
		transform : translate(17.33vw, -16.53vw);
	}
	.disc_info .line02 img.in {
		transform : translate(0, 0);
		transition:all 0.5s ease-in-out;
		transition-delay: 0.3s;
	}

	.disc_info .image {
		margin: 0 0 5.33vw 0;
		width: 100%;
		max-width: 100%;
		float: none;
	}
	.disc_info .box {
		overflow: hidden;
	}
	.disc_info .box .new {
		margin: 0 0 0.9vw 0;
		line-height: 1.4em;
		font-size: 3.73vw;
		font-weight: 300;
		font-family: 'Antonio', sans-serif;
		color: #E30083;
	}
	.disc_info .box h3 {
		margin: 0 0 0.9vw 0;
		line-height: 1.4em;
		font-size: 8.53vw;
		font-weight: 300;
		font-family: 'Antonio', sans-serif;
		color: #000416;
	}
	.disc_info .box .release {
		margin: 0 0 1.25vw 0;
		line-height: 1.4em;
		font-size: 6.4vw;
		font-weight: 300;
		font-family: 'Antonio', sans-serif;
		color: #000416;
	}
	.disc_info .box ol {
		margin: 0 0 2.6vw 0;
		line-height: 1.4em;
		font-size: 3.2vw;
		font-weight: normal;
		font-family: 'Roboto', sans-serif;
		color: #000416;
	}
	.disc_info .box .price {
		margin: 0 0 2.6vw 0;
		line-height: 1.4em;
		font-size: 3.2vw;
		font-weight: normal;
		font-family: 'Roboto', sans-serif;
		color: #000416;
	}
	.disc_info .box .link {
		max-width: 68vw;
	}
	.disc_info .box .link a {
		padding: 0.58vw 0.9vw 0.9vw 0.9vw;
		line-height: 1.2em;
		text-align: center;
		text-decoration: none;
		font-size: 5.33vw;
		font-weight: 300;
		font-family: 'Antonio', sans-serif;
		color: #000;
		border: 2px solid #000;
		display: block;
		position: relative;
		overflow: hidden;
	}
	.disc_info .box .link a:hover {
		color: #fff;
	}




	/**
	 * video box
	**/
	.video_box {
		width: 89.6%;
		height: 0px;
		padding-top: 62.77%;
		aspect-ratio: 16 / 9;
		text-align: left;
		margin: 0 auto 13.33vw;
		position: relative;
	}
	.video_box iframe {
		position: absolute;
		top: 0;
		right: 0;
		width: 100% !important;
		height: auto !important;
		aspect-ratio: 16 / 9 !important;
	}


	/**
	 * live info
	**/
	.live_info {
	}
	.live_info .wrap {
		margin: 0 auto 16.33vw;
		padding: 0 0 0 0;
		width: 89.6%;
		max-width: 1200px;
		text-align: left;
		box-sizing: border-box;
		position: relative;
	}
	.live_info .wrap h3 {
		line-height: 1em;
		font-size: 12.8vw;
		font-weight: 300;
		font-family: 'Antonio', sans-serif;
		text-align: left;
		color: #000416;
		position: absolute;
		top: 0;
		left: 1em;
		transform: rotate( 90deg );
		transform-origin: left top;
	}
	.live_info .wrap ul {
		margin: 0 0 5.33vw 17.33vw;
	}
	.live_info .wrap ul li {
		border-bottom: 1px solid #000416;
	}
	.live_info .wrap ul li a {
		padding: 2.6vw 15px 2.6vw 0;
		text-decoration: none;
		display: block;
		overflow: hidden;
		position: relative;
	}
	.live_info .wrap ul li a:after {
		margin: -1px 0 0 0;
		width: 10px;
		height: 3px;
		line-height: 6px;
		content: "";
		background: url(./img/arrow_01.png) no-repeat center center;
		background-size: cover;
		position: absolute;
		top: 50%;
		right: 0;
	}
	.live_info .wrap ul li a .update {
		margin: 0 15px 0 0;
		width: 100%;
		line-height: 1.4em;
		text-align: left;
		font-size: 3.73vw;
		font-weight: 300;
		font-family: 'Antonio', sans-serif;
		color: #666666;
		float: none;
	}
	.live_info .wrap ul li a .title {
		line-height: 1.4em;
		font-size: 3.73vw;
		overflow: hidden;
	}
	.live_info .wrap .link {
		margin: 0 auto;
		max-width: 68vw;
	}
	.live_info .wrap .link a {
		padding: 0.58vw 0.9vw 0.9vw 0.9vw;
		line-height: 1.2em;
		text-align: center;
		text-decoration: none;
		font-size: 5.33vw;
		font-weight: 300;
		font-family: 'Antonio', sans-serif;
		color: #000;
		border: 2px solid #000;
		display: block;
		position: relative;
		overflow: hidden;
	}
	.live_info .wrap .link a:hover {
		color: #fff;
	}


	/**
	 * discography
	**/
	.top_discography {
		margin: 0 0 16vw 0;
		width: 100%;
		background: url(./img/discography_back_01-sp.png) no-repeat right top;
		background-size: auto 112.13vw;
	}
	.top_discography .wrap {
		margin: 0 auto 0;
		padding: 10.66vw 0 0 0;
		width: 89.6%;
		max-width: 1200px;
		text-align: left;
		box-sizing: border-box;
		position: relative;
	}
	.top_discography .wrap .line01 {
		width: 17.33vw;
		height: 15.73vw;
		overflow: hidden;
		position: absolute;
		top: -22.93vw;
		left: 0;
	}
	.top_discography .wrap .line01 img {
		transform : translate(17.33vw, -15.73vw);
	}
	.top_discography .wrap .line01 img.in {
		transform : translate(0, 0);
		transition:all 0.5s ease-in-out;
	}
	.top_discography .wrap .line02 {
		width: 26.13vw;
		height: 23.73vw;
		overflow: hidden;
		position: absolute;
		top: -14.66vw;
		left: -3.2vw;
	}
	.top_discography .wrap .line02 img {
		transform : translate(26.13vw, -23.73vw);
	}
	.top_discography .wrap .line02 img.in {
		transform : translate(0, 0);
		transition:all 0.5s ease-in-out;
		transition-delay: 0.3s;
	}
	.top_discography .wrap .line03 {
		width: 14.4vw;
		height: 13.33vw;
		overflow: hidden;
		position: absolute;
		top: -18.93vw;
		left: 19.2vw;
	}
	.top_discography .wrap .line03 img {
		transform : translate(14.4vw, -13.33vw);
	}
	.top_discography .wrap .line03 img.in {
		transform : translate(0, 0);
		transition:all 0.5s ease-in-out;
		transition-delay: 0.6s;
	}


	.top_discography .wrap h3 {
		line-height: 1em;
		font-size: 12.8vw;
		font-weight: 300;
		font-family: 'Antonio', sans-serif;
		color: #fff;
		text-align: left;
		position: absolute;
		top: 10.66vw;
		left: 1em;
		transform: rotate( 90deg );
		transform-origin: left top;
	}
	.top_discography .wrap ul {
		margin: 0 0 29.33vw 17.33vw;
		padding: 5vw;
		width: 100vw;
		background: #fff;
		border: 1px solid #000416;
		box-sizing: border-box;
	}
	.top_discography .wrap ul li {
	/*	width: 300px;*/
		font-family: 'Roboto', sans-serif;
	/*	float: left;*/
	}
	.top_discography .wrap ul li .image {
		margin: 0 5.5vw 1.66vw 0;
		width: 61.33vw;
	}
	.top_discography .wrap ul li .name {
		margin: 0 5.5vw 0 0;
		line-height: 1.4em;
		font-size: 3.73vw;
	}
	.top_discography .wrap ul li .name a {
		text-decoration: none;
		color: #000416;
	}
	.top_discography .wrap ul li .release {
		margin: 0 5.5vw 0 0;
		line-height: 1.4em;
		font-size: 2.66vw;
		color: #666666;
	}
	.top_discography .wrap .link {
		margin: 0 auto;
		max-width: 68vw;
	}
	.top_discography .wrap .link a {
		padding: 0.58vw 0.9vw 0.9vw 0.9vw;
		line-height: 1.2em;
		text-align: center;
		text-decoration: none;
		font-size: 5.33vw;
		font-weight: 300;
		font-family: 'Antonio', sans-serif;
		color: #000;
		border: 2px solid #000;
		display: block;
		position: relative;
		overflow: hidden;
	}
	.top_discography .wrap .link a:hover {
		color: #fff;
	}



	/**
	 * music video
	**/
	.music_video {
	}
	.music_video .wrap {
		margin: 0 auto 16vw;
		padding: 0 0 0 0;
		width: 89.6%;
		max-width: 1200px;
		text-align: left;
		box-sizing: border-box;
		position: relative;
	}
	.music_video .wrap h3 {
		line-height: 1em;
		font-size: 12.8vw;
		font-weight: 300;
		font-family: 'Antonio', sans-serif;
		text-align: left;
		color: #000416;
		position: absolute;
		top: 0;
		left: 1em;
		transform: rotate( 90deg );
		transform-origin: left top;
	}
	.music_video .wrap ul {
		margin: 0 0 3.33vw 17.33vw;
	}
	.music_video .wrap ul li {
		margin: 0 0 5.33vw 0;
		width: 72vw;
		max-width: 72vw;
		font-family: 'Roboto', sans-serif;
		float: none;
	}
	.music_video .wrap ul li:nth-of-type(2n) {
		float: none;
	}
	.music_video .wrap ul li:nth-of-type(2n+1) {
		clear: both;
	}
	.music_video .wrap ul li .video {
		margin: 0 0 2.66vw 0;
		width: 100%;
		position: relative;
		padding-top: 56.25%;
	}
	.music_video .wrap ul li .video iframe {
		position: absolute;
		top: 0;
		right: 0;
		width: 100% !important;
		height: 100% !important;
	}
	.music_video .wrap ul li .name {
		line-height: 1.4em;
		font-size: 3.73vw;
	}
	.music_video .wrap ul li .name a {
		text-decoration: none;
		color: #000416;
	}
	.music_video .wrap ul li .release {
		line-height: 1.4em;
		font-size: 2.66vw;
		color: #666666;
	}
	.music_video .wrap .link {
		margin: 0 auto;
		max-width: 68vw;
	}
	.music_video .wrap .link a {
		padding: 0.9vw;
		line-height: 1.4em;
		text-align: center;
		text-decoration: none;
		font-size: 5.33vw;
		font-weight: 300;
		font-family: 'Antonio', sans-serif;
		color: #000;
		border: 2px solid #000;
		display: block;
		position: relative;
		overflow: hidden;
	}
	.music_video .wrap .link a:hover {
		color: #fff;
	}
	/* second level  */
	.second_level {
		margin: 33.6vw 0 0 0;
	}
	/** page **/
	.profile {
	}
	.profile .wrap {
		margin: 0 auto 40vw;
		padding: 0 0 0 0;
		width: 78.6%;
		max-width: 1200px;
		text-align: left;
		box-sizing: border-box;
		position: relative;
	}
	.page_title01 {
		margin: 0 0 8.53vw 0;
		line-height: 1.2em;
		font-size: 12.8vw;
		font-weight: 300;
		font-family: 'Antonio', sans-serif;
		text-align: left;
		color: #fff;
		position: relative;
		top: auto;
		left: auto;
		transform: rotate( 0deg );
		transform-origin: left top;
	}
	.second_level .wrap .description,
	.profile .wrap .description {
		margin: 0 0 6.6vw 0;
		line-height: 2em;
		font-size: 3.2vw;
		text-align: left;
		color: #fff;
		overflow: hidden;
	}
	.profile .wrap .description p {
		margin: 0 0 6.6vw 0;
	}
	.profile .wrap ul {
		display: block;
		overflow: hidden;
	}
	.profile .wrap ul li {
		margin: 0 0 16vw 0;
		width: 100%;
		max-width: 100%;
		line-height: 1.2em;
		font-size: 3.2vw;
		font-weight: normal;
		font-family: 'Roboto', sans-serif;
		color: #fff;
		float: left;
		position: relative;
		overflow: hidden;
	}
	.profile .wrap ul li:after {
		width: 100%;
		height: 0;
		line-height: 0;
		content: "";
		border-top: 1px solid #4d4d4d;
		position: absolute;
		bottom: 0.7em;
		right: 66px;
		z-index: 0;
	}
	.profile .wrap ul li:nth-of-type(3) {
		margin: 0 0 0 0;
	}
	.profile .wrap ul li .image {
		margin: 0 0 4.8vw 0;
	}
	.profile .wrap ul li .instagram {
		width: 4.8vw;
		position: absolute;
		bottom: 3px;
		right: 0;
	}
	.profile .wrap ul li .twitter {
		width: 4.8vw;
		position: absolute;
		bottom: 3px;
		right: 6.93vw;
	}
	.profile .wrap ul li p {
		margin: 0 17.6vw 0 0;
		padding: 0 4.8vw 0 0;
		background: #000416;
		position: relative;
		z-index: 1;
		display: inline-block;
	}
	.profile .wrap ul li p .name {
		line-height: 1.2em;
		font-size: 4.8vw;
		font-weight: bold;
	}
	.profile .wrap .line_wrap {
		position: relative;
	}

	.profile .wrap .line01 {
		width: 17.33vw;
		height: 15.73vw;
		overflow: hidden;
		position: absolute;
		top: -5.86vw;
		left: auto;
		right: 8.53vw;
	}
	.profile .wrap .line01 img {
		transform : translate(17.33vw, -15.73vw);
	}
	.profile .wrap .line01 img.in {
		transform : translate(0, 0);
		transition:all 0.5s ease-in-out;
	}
	.profile .wrap .line02 {
		width: 26.13vw;
		height: 23.73vw;
		overflow: hidden;
		position: absolute;
		top: 0vw;
		left: auto;
		right: 4vw;
	}
	.profile .wrap .line02 img {
		transform : translate(26.13vw, -23.73vw);
	}
	.profile .wrap .line02 img.in {
		transform : translate(0, 0);
		transition:all 0.5s ease-in-out;
		transition-delay: 0.3s;
	}
	.profile .wrap .line03 {
		width: 14.4vw;
		height: 13.33vw;
		overflow: hidden;
		position: absolute;
		top: -2.93vw;
		left: auto;
		right: -4vw;
	}
	.profile .wrap .line03 img {
		transform : translate(14.4vw, -13.33vw);
	}
	.profile .wrap .line03 img.in {
		transform : translate(0, 0);
		transition:all 0.5s ease-in-out;
		transition-delay: 0.6s;
	}
	.profile .wrap .line04 {
		width: 26.13vw;
		height: 23.73vw;
		overflow: hidden;
		position: absolute;
		top: -4vw;
		right: auto;
		left: 4vw;
	}
	.profile .wrap .line04 img {
		transform : translate(26.13vw, -23.73vw);
	}
	.profile .wrap .line04 img.in {
		transform : translate(0, 0);
		transition:all 0.5s ease-in-out;
	}
	.profile .wrap .line05 {
		width: 14.4vw;
		height: 13.33vw;
		overflow: hidden;
		position: absolute;
		top: -4.8vw;
		right: auto;
		left: 20.5vw;
	}
	.profile .wrap .line05 img {
		transform : translate(14.4vw, -13.33vw);
	}
	.profile .wrap .line05 img.in {
		transform : translate(0, 0);
		transition:all 0.5s ease-in-out;
		transition-delay: 0.3s;
	}
	.profile .wrap .line06 {
		width: 26.13vw;
		height: 24.53vw;
		overflow: hidden;
		position: absolute;
		top: auto;
		bottom: -35.83vw;
		right: 5.86vw;
	}
	.profile .wrap .line06 img {
		transform : translate(26.13vw, -24.53vw);
	}
	.profile .wrap .line06 img.in {
		transform : translate(0, 0);
		transition:all 0.5s ease-in-out;
	}
	.profile .wrap .line07 {
		width: 17.33vw;
		height: 16.53vw;
		overflow: hidden;
		position: absolute;
		top: auto;
		bottom: -18.66vw;
		right: 0vw;
	}
	.profile .wrap .line07 img {
		transform : translate(17.33vw, -16.53vw);
	}
	.profile .wrap .line07 img.in {
		transform : translate(0, 0);
		transition:all 0.5s ease-in-out;
		transition-delay: 0.3s;
	}


}

/* Slider */
.slick-slider {
		position: relative;

		display: block;
		box-sizing: border-box;

		-webkit-user-select: none;
			 -moz-user-select: none;
				-ms-user-select: none;
						user-select: none;

		-webkit-touch-callout: none;
		-khtml-user-select: none;
		-ms-touch-action: pan-y;
				touch-action: pan-y;
		-webkit-tap-highlight-color: transparent;
}

.slick-list
{
		position: relative;

		display: block;
		overflow: hidden;

		margin: 0;
		padding: 0;
}
.slick-list:focus
{
		outline: none;
}
.slick-list.dragging
{
		cursor: pointer;
		cursor: hand;
}

.slick-slider .slick-track,
.slick-slider .slick-list
{
		-webkit-transform: translate3d(0, 0, 0);
			 -moz-transform: translate3d(0, 0, 0);
				-ms-transform: translate3d(0, 0, 0);
				 -o-transform: translate3d(0, 0, 0);
						transform: translate3d(0, 0, 0);
}

.slick-track
{
		position: relative;
		top: 0;
		left: 0;

		display: block;
		margin-left: auto;
		margin-right: auto;
}
.slick-track:before,
.slick-track:after
{
		display: table;

		content: '';
}
.slick-track:after
{
		clear: both;
}
.slick-loading .slick-track
{
		visibility: hidden;
}

.slick-slide
{
		display: none;
		float: left;

		height: 100%;
		min-height: 1px;
}
[dir='rtl'] .slick-slide
{
		float: right;
}
.slick-slide img
{
		display: block;
}
.slick-slide.slick-loading img
{
		display: none;
}
.slick-slide.dragging img
{
		pointer-events: none;
}
.slick-initialized .slick-slide
{
		display: block;
}
.slick-loading .slick-slide
{
		visibility: hidden;
}
.slick-vertical .slick-slide
{
		display: block;

		height: auto;

		border: 1px solid transparent;
}
.slick-arrow.slick-hidden {
		display: none;
}


@charset 'UTF-8';
/* Slider */
.slick-loading .slick-list {
}

/* Arrows */
.slick-prev,
.slick-next
{
	font-size: 0;
	line-height: 0;

	position: absolute;
	bottom: -46px;

	display: block;

	width: 60px;
	height: 25px;
	padding: 0;

	cursor: pointer;

	color: transparent;
	border: none;
	outline: none;
}

.slick-prev:before,
.slick-next:before
{
	font-family: 'slick';
	font-size: 20px;
	line-height: 1;

	opacity: .75;
	color: white;

	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

.slick-prev
{
	text-align: left;
	background: url(./img/prev.png) no-repeat right bottom;
	background-size: auto 100%;
	left: 80px;
}
.slick-prev:before {
	line-height: 1.1em;
	font-size: 14px;
	font-weight: 300;
	font-family: 'Antonio', sans-serif;
	letter-spacing: 1px;
	content: 'PREV';
}

.slick-next
{
	text-align: right;
	background: url(./img/next.png) no-repeat left bottom;
	background-size: auto 100%;
	left: 0;
}
.slick-next:before
{
	line-height: 1.1em;
	font-size: 14px;
	font-weight: 300;
	font-family: 'Antonio', sans-serif;
	letter-spacing: 1px;
	content: 'NEXT';
}

/* Dots */
.slick-dotted.slick-slider
{
	margin-bottom: 30px;
}

.slick-dots
{
	position: absolute;
	bottom: -25px;

	display: block;

	width: 100%;
	padding: 0;
	margin: 0;

	list-style: none;

	text-align: center;
}
.slick-dots li
{
	position: relative;

	display: inline-block;

	width: 20px;
	height: 20px;
	margin: 0 5px;
	padding: 0;

	cursor: pointer;
}
.slick-dots li button
{
	font-size: 0;
	line-height: 0;

	display: block;

	width: 20px;
	height: 20px;
	padding: 5px;

	cursor: pointer;

	color: transparent;
	border: 0;
	outline: none;
	background: transparent;
}
.slick-dots li button:hover,
.slick-dots li button:focus
{
	outline: none;
}
.slick-dots li button:hover:before,
.slick-dots li button:focus:before
{
	opacity: 1;
}
.slick-dots li button:before
{
	font-family: 'slick';
	font-size: 6px;
	line-height: 20px;

	position: absolute;
	top: 0;
	left: 0;

	width: 20px;
	height: 20px;

	content: '•';
	text-align: center;

	opacity: .25;
	color: black;

	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
.slick-dots li.slick-active button:before
{
	opacity: .75;
	color: black;
}



/*________________________ bits ________________________\*/
.flex {
	display: flex;
}
.fclear {
	clear: both;
}

.float_l {
	float: left;
}

.float_r {
	float: right;
}

p img.float_l {
	margin: 0 15px 15px 0;
}

p img.float_r {
	margin: 0 0 15px 15px;
}

.align_c {
	text-align: center !important;
}

.align_c img {
	margin-left: auto !important;
	margin-right: auto !important;
}

.align_l {
	text-align: left !important;
}

.align_r {
	text-align: right !important;
}

.nomargin {
	margin: 0 !important;
}
.marginb0 {
	margin-bottom: 0px !important;
}
.marginb10 {
	margin-bottom: 10px !important;
}
.marginb20 {
	margin-bottom: 20px !important;
}
.marginb30 {
	margin-bottom: 30px !important;
}
.marginb40 {
	margin-bottom: 50px !important;
}
.marginb50 {
	margin-bottom: 50px !important;
}
.marginb2em {
	margin-bottom: 2em !important;
}

.nopadding {
	padding: 0 !important;
}
.paddingt2em {
	padding-top: 2em !important;
}
.paddingt10 {
	padding-top: 10px !important;
}
.paddingt20 {
	padding-top: 20px !important;
}
.paddingb10 {
	padding-bottom: 10px !important;
}
.paddingb20 {
	padding-bottom: 20px !important;
}
.paddingb30 {
	padding-bottom: 30px !important;
}

.hide {
	display: none !important;
}
.hidden {
	visibility: hidden !important;
}
.hidedisp {
	position:absolute;
	left: -1000%;
}

.underline {
	text-decoration: underline;
}
.overline {
	text-decoration: overline;
}
.ssfont {
	font-size: xx-small !important;
}
.sfont {
	font-size: x-small !important;
}
.mfont {
	font-size: medium !important;
}
.x08emfont {
	font-size: 0.8em !important;
}
.x10emfont {
	font-size: 1em !important;
}
.x12emfont {
	font-size: 1.2em !important;
}
.x14emfont {
	font-size: 1.4em !important;
}
.x16emfont {
	font-size: 1.6em !important;
}
.x18emfont {
	font-size: 1.8em !important;
}
.white {
	color: #fff !important;
}
.blue {
	color: #00f !important;
}

.red {
	color: #f00 !important;
}

.orange {
	color: #f60 !important;
}

.pink {
	color: #e43f7b !important;
}
.pinkline {
	background: #ffe7ef;
	padding: 1px;
}
.brown01 {
	color: #9a5000 !important;
}
.date {
	color: #a0a0a0;
}
.bold {
	font-weight: bold !important;
}
.italic {
	font-style: italic
}
.nowrap {
	white-space: nowrap;
}
hr.hidden {
	height: 1px;
	clear: both;
	padding: 0;
	margin: 0;
	overflow: hidden;
}
br.fclear {
	clear: both;
	font-size: 1px;
	line-height: 0;
	height: 1px;
	overflow: hidden;
}
div.fclear {
	height: 1px;
	overflow: hidden ;
}
.fclear hr {
	display: none;
	height: 0;
	margin: 0;
	padding: 0;
	overflow: hidden ;
}

iframe.ec360_01 {
	width: 100%;
	height: 550px;
	margin: 0 0 0;
	border: 1px solid #f0f0f0;
	overflow: hidden;
}

.sp_h115 {
	max-height: 115px;
	overflow: hidden;
}
.pc_hide {
	display: none;
}
.mobile_hide {
	display: block;
}
p.supplement {
	color: #666;
	font-size: 14px;
	text-indent: -1em;
	line-height: 1.4em;
	padding: 10px 1em 0;
	margin: 0;
}
code#code01 {
	display: block;
	width: calc(100% - 20px);
	height: 300px;
	font-size: 12px;
	line-height: 1.4em;
	white-space: pre;
	padding: 5px 10px;
	border: 1px solid #999;
	overflow-x: auto;
	overflow-y: scroll;
}
code#code02 {
	display: block;
	width: calc(100% - 20px);
	height: 5em;
	font-size: 12px;
	line-height: 1.4em;
	white-space: pre;
	padding: 5px 10px;
	margin: 0 0 40px;
	border: 1px solid #999;
	overflow-x: auto;
	overflow-y: scroll;
}
.notes {
	padding: 15px 20px;
	background: #f0f0f0;
}
.notes p {
	font-size: 12px;
	line-height: 1.5em;
	text-indent: -1em;
	padding: 0 0 0 1em;
	margin: 0;
}

.font_antonio {
	font-family: 'Antonio', sans-serif;
}
