﻿@charset "utf-8";

/*
YUI 3.18.1 (build f7e7bcb)
Copyright 2014 Yahoo! Inc. All rights reserved.
Licensed under the BSD License.
http://yuilibrary.com/license/
*/

html{color:#000;background:#FFF}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0}table{border-collapse:collapse;border-spacing:0}fieldset,img{border:0}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal}ol,ul{list-style:none}caption,th{text-align:left}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal}q:before,q:after{content:''}abbr,acronym{border:0;font-variant:normal}sup{vertical-align:text-top}sub{vertical-align:text-bottom}input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit;*font-size:100%}legend{color:#000}#yui3-css-stamp.cssreset{display:none}

/*
    Colorbox Core Style:
    The following CSS is consistent between example themes and should not be altered.
*/
#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden; -webkit-transform: translate3d(0,0,0);}
#cboxWrapper {max-width:none;}
#cboxOverlay{position:fixed; width:100%; height:100%;opacity: 1 !important;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative;}
#cboxLoadedContent{overflow:auto; -webkit-overflow-scrolling: touch;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%; height:100%;}
#cboxSlideshow{cursor:pointer;}
#colorbox, #cboxContent, #cboxLoadedContent{box-sizing:content-box; -moz-box-sizing:content-box; -webkit-box-sizing:content-box;}

/* 
    User Style:
    Change the following styles to modify the appearance of Colorbox.  They are
    ordered & tabbed in a way that represents the nesting of the generated HTML.
*/
#cboxOverlay{background:#fff;}
#colorbox{outline:0;}
    #cboxContent{margin-top:80px; overflow:visible; background:#fff;padding-bottom: 180px;}
        .cboxIframe{background:#fff;}
        #cboxError{padding:50px; border:1px solid #ccc;}
        #cboxLoadedContent{background:#fff; padding:1px;}
        #cboxLoadingGraphic{background:url(loading.gif) no-repeat center center;}
        #cboxLoadingOverlay{background:#fff;}

        /* these elements are buttons, and may need to have additional styles reset to avoid unwanted base styles */
        #cboxClose {border:0; padding:0; margin:0; overflow:visible; text-indent:-9999px; width:58px; height:58px; position:absolute; background:url(controls.png) no-repeat 0 0;cursor: pointer;}
        
        /* avoid outlines on :active (mouseclick), but preserve outlines on :focus (tabbed navigating) */
       #cboxClose:active {outline:0;}
       #cboxClose:hover{opacity: 0.3;}
        #cboxClose{left:50%;margin-left: -29px;bottom:5px;}


/* ----------------------------------------

Redefine

---------------------------------------- */

body {
	color: 330000;
	font-family: 'Noto Sans JP', "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", "メイリオ", sans-serif;
	font-size: 16px;
	line-height: 1;
	letter-spacing: 0.1em;
	-webkit-text-size-adjust: 100%;
}

a{
	color: #E68600;
	text-decoration: none;
}

a:hover{
	border-bottom:none;
}

/* ----------------------------------------

Redefine - container

---------------------------------------- */

div#container {
	width: 730px;
	margin: 50px auto;
	font-size: 100%;
	opacity: 0;
}

/*  --
WinIE,MacIE4,NN4,Opera7以下は除外
レガシーブラウザを回避してpx指定する場合
-- */

html[xmlns]>/**/body div#container {
/*	font-size: 13px;*/
}

/* ----------------------------------------

Redefine - header

---------------------------------------- */

div#header{
	background: url("../img/header/img_main.jpg") no-repeat;
	width: 1110px;
	height:986px; 
	position: relative;
	margin: 0 auto;
	opacity: 0;
}

div#header div#onsale{
	position: absolute;
	right:-65px;
	top:10px;
}

/* ----------------------------------------

Redefine - lead

---------------------------------------- */

div#lead{
	margin-bottom: 110px;
}

div#lead div.fll{
	width: 370px;
}

div#lead div.flr{
	width: 350px;
}


/* ----------------------------------------

Redefine - disc

---------------------------------------- */
div#disc{
	margin-bottom: 160px;
}

div#disc img{
	border:1px solid #000;
}

div#disc div.disc-box div.fll{
	width: 402px;
}

div#disc div.disc-box div.flr{
	width: 300px;
}

div#disc div.disc-box div.fll a.inline:hover,
div#inline_content a:hover{
	border-bottom: 1px solid;
}

div#disc div.disc-box div.fll a.overimg{
	color:#fff;
	background-color: #E68600;
	padding: 10px 15px;
	display: inline-block;
	margin-right: 0.5em;
	margin-bottom: 0.9em;
}

div#disc div.disc-box div.flr ul li{
	margin-bottom: 19px;
}

/* ----------------------------------------

Redefine - special

---------------------------------------- */

div#special{
	margin-bottom: 184px;
}

div#special div.fll{
	width: 220px;
	height: 220px;
}

div#special div.flr{
	width: 480px;
}

/* ----------------------------------------

Redefine - video

---------------------------------------- */

div#video{
	margin-bottom: 225px;
}

/* ----------------------------------------

Redefine - live

---------------------------------------- */

div#live{
	margin-bottom: 140px;
}

/* ----------------------------------------

Redefine - profile

---------------------------------------- */
div#profile{
	margin-bottom: 170px;	
}

div#profile div#photo-profile{
	margin-left: -80px;
}

div#profile div#profile-box{
	width: 780px;
	margin: 0 auto;
}

div#profile div#profile-box div.flr{
	width: 540px;
}

div#live a:hover,
div#profile div#profile-box div.flr a:hover{
	border-bottom:1px solid;
}


/* ----------------------------------------

Redefine - footer

---------------------------------------- */

div#footer {
	padding-bottom: 50px;
}

div#footer a{
	text-decoration: underline;
}

div#footer a:hover{
	text-decoration: none;
}

/* ----------------------------------------

Common Class

---------------------------------------- */

.clear {clear: both;}
.fll {float:left;}
.flr {float:right;}
.fs50{font-size: 50px;}
.fs40{font-size: 40px;}
.fs32{font-size: 32px;}
.fs30{font-size: 30px;}
.fs26{font-size: 26px;}
.fs24{font-size: 24px;}
.fs22{font-size: 22px;}
.fs20{font-size: 20px;}
.fs19{font-size: 19px;}
.fs18{font-size: 18px;}
.fs16{font-size: 16px;}
.fs15{font-size: 15px;}
.fs14{font-size: 14px;}
.fs13{font-size: 13px;}
.fs12{font-size: 12px;}
.fs11{font-size: 11px;}
.fs10{font-size: 10px;}
.fwb{font-weight: bold;}
.fw300{font-weight: 300;}
.fw700{font-weight: 700;}
.fw900{font-weight: 900;}
.fcr{color:#D43702;}
.fco{color:#E68600;}
.fcg{color:#A37D22;}
.mb5{margin-bottom: 5px;}
.mb10{margin-bottom: 10px;}
.mb15{margin-bottom: 15px;}
.mb20{margin-bottom: 20px;}
.mb25{margin-bottom: 25px;}
.mb30{margin-bottom: 30px;}
.mb35{margin-bottom: 35px;}
.mb40{margin-bottom: 40px;}
.mb45{margin-bottom: 45px;}
.mb50{margin-bottom: 50px;}
.mb55{margin-bottom: 55px;}
.mb60{margin-bottom: 60px;}
.mb65{margin-bottom: 65px;}
.mb70{margin-bottom: 70px;}
.mb75{margin-bottom: 75px;}
.mb80{margin-bottom: 80px;}
.mb85{margin-bottom: 85px;}
.mb90{margin-bottom: 90px;}
.mb100{margin-bottom: 100px;}
.mb110{margin-bottom: 110px;}
.mb160{margin-bottom: 160px;}
.mb230{margin-bottom: 230px;}
.mt10{margin-top: 10px;}
.mt40{margin-top: 40px;}
.ml32{margin-left: 32px;}
.lh140{line-height: 140%;}
.lh160{line-height: 160%;}
.lh180{line-height: 180%;}
.lh200{line-height: 200%;}
.lh230{line-height: 230%;}
.lh250{line-height: 250%;}
.lh270{line-height: 270%;}
.lh300{line-height: 300%;}
.tac{text-align: center;}
.tar{text-align: right;}
.left{float: left;}
.right{float: right;}
.br-sp {display:none;}
.br-pc {display:inline;}
.lato{font-family: 'Lato', sans-serif;letter-spacing: 0;}


/* ----------------------------------------

clearfix

---------------------------------------- */

.clearfix::after {
	content: "";
	display: table;
	clear: both;
}

/*------------------------------------*\
    Media Queries
\*------------------------------------*/

@media screen and (max-width: 640px) {
	body{font-size: 27px;}
	.fs50{font-size: 55px;}
	.fs40{font-size: 55px;}
	.fs30{font-size: 37px;}
	.fs26{font-size: 37px;}
	.fs24{font-size: 35px;}
	.fs22{font-size: 33px;}
	.fs20{font-size: 31px;}
	.fs19{font-size: 30px;}
	.fs18{font-size: 29px;}
	.fs16{font-size: 27px;}
	.fs15{font-size: 26px;}
	.fs14{font-size: 25px;}
	.fs13{font-size: 24px;}
	.fs12{font-size: 23px;}
	.fs11{font-size: 22px;}
	.fs10{font-size: 54px;}
	.br-sp {display:inline;}
	.br-pc {display:none;}
	
	div#header{
		width: 540px;
		height:478px; 
		background-size: 540px 478px;
	}
	
	div#header div#onsale{
		right:-40px;
	}
	
	div#header div#onsale img{
		width: 100px;
		height: 100px;
	}
	
	div#container {
		width: 560px;
	}
	
	div#lead div.fll,
	div#lead div.flr{
		width: 100%;
		float: none;
	}
	
	div#lead div.fll{
		margin-bottom: 50px;
	}
	
	div#lead div.flr p.lh250{
		line-height: 180%;
	}
	
	div#disc{
		margin-bottom: 100px;
	}
	
	div#disc div.disc-box img{
		width: 560px;
		height: auto;
	}
	
	div#disc div.disc-box div.fll,
	div#disc div.disc-box div.flr{
		width: 100%;
		float: none;
	}
	
	div#disc div.disc-box div.fll,
	div#disc div.disc-box div.flr{
		text-align: center;
	}
	
	div#disc div.disc-box div.flr ul li{
		margin-bottom: 30px;
	}
	
	div#special div.flr{
		width: 320px;
	}
	
	div#video iframe{
		width: 560px;
		height:315px;
	}
	
	div#live h3.lh180{line-height: 160%;}
	
	div#profile div.fll,
	div#profile div.flr{
		float: none;
		width: 100%;
	}
	
	div#profile div#photo-profile{
		margin-left: 0px;
	}
	
	div#profile div#photo-profile img{
		width: 560px;
		height: auto;
	}
	
	div#profile div#profile-box{
		width: 100%;
	}
	
	div#profile div.fll{
		margin-bottom: 35px;
	}
	
	div#profile div#profile-box div.fll,
	div#profile div#profile-box div.flr{
		width: 100%;
	}
	
	div#footer a{
		font-size: 16px;
	}
}