@charset "utf-8";

body#chara::before{
background: auto;
position: static;
width: 0;
height: 0;
}

/*-- 上下赤ライン --*/
#main_banner.line01, #banner_area.line01, #top-search.line01{
border-top: solid 3px rgba(172,6,9,1.00);
border-bottom: solid 3px rgba(172,6,9,1.00);
}

/*-- 設置店検索非表示 --*/
#search_pc{display: none!important;}

/*
================================================================================================================
背景
================================================================================================================
*/
#box_bg01 {
width: 100%;
/*background:url("../img/bg/");*/
background-color: rgba(0,20,40,1.00);
background-size: 600px;
background-repeat: repeat;
background-position: center top;
}
/*
================================================================================================================
メインバナー
================================================================================================================
*/
#main_box{
width: 100%;
height: auto;
/*max-height:640px;*/
margin: 0;
padding: 0;
background-color: rgba(0,0,0,1.00);
}
@media screen and (max-width:800px) {
#main_box{
width: 100%;
height:auto;
margin: 0;
padding: 0;
background-color:rgba(0, 20, 40, 1.00)!important;
}
}

/*--パララックス背景--*/
.cd-fixed-bg  {
/*height:66vw;*/
/*max-height:800px;*/
background-image: url("../img/bg/00_top_bg01.jpg");
background-attachment: fixed!important;
background-size:640px;
background-position: top center;
background-repeat: repeat;
overflow: hidden;
display: flex;
	flex-wrap: wrap;
    justify-content: center;
    align-items: flex-end;
-webkit-animation: kira 20s linear infinite;/*chrome&safari*/
-moz-animation: kira 20s linear infinite;/*firefox*/
-ms-animation: kira 20s linear infinite;/*ie*/
animation: kira 20s linear infinite;
	}
/*バックグラウンド★アニメーション*/
@keyframes kira {
 0% {background-position: 0 0;}
 100% {background-position: 0px -640px;}
	}
/*chrome&safari*/
@-webkit-keyframes kira {
 0% {background-position: 0 0;}
 100% {background-position: 0px -640px;}
	}
/*firefox*/
@-moz-keyframes kira {
 0% {background-position: 0 0;}
 100% {background-position: 0px -640px;}
	}
/*ie*/
@-ms-keyframes kira {
 0% {background-position: 0 0;}
 100% {background-position: 0px -640px;}
	}

/*-- 巻物枠 --*/
.roll-waku{
	width: 100%;
	display: flex;
	flex-wrap: nowrap;
}
.roll-waku .roll01,.roll-waku .roll03{width: 3%;}
.roll-waku .roll02{width: 94%; margin: 0; padding: 0; background-image: url("../img/00_hiden/roll_loop.png"); background-repeat: repeat-x; background-size: contain;}
.roll01 img, .roll02 img, .roll03 img{width: 100%;}

/*-- 巻物アニメーション --*/
.roll-anim{width:100%; max-height: 0; overflow: hidden; transition: 0.5s;}

/*
================================================================================================================
コンテンツエリア
================================================================================================================
*/
#con_area {
  width:calc(100% - 6px);
  max-width: 1160px;
  min-height: 960px;
  margin: 65px auto 30px auto;
	padding:0px;
	position: inherit;
}
@media screen and (max-width:1199px) {
#con_area {
min-height: 80vw;
}
}
@media screen and (max-width:799px) {
#con_area {
  margin: 5px auto 15px auto;
    flex-wrap: wrap;
min-height: 80vw;
}
}
@media screen and (max-width:639px) {
#con_area {
  margin: 5px auto 15px auto;
    flex-wrap: wrap;
min-height: 196vw;
}
}

#con_area .box_01{
  width:94%;
  /*min-height: 100px;*/
  margin:0 auto;
	position: inherit;
	padding: 5px;
    background-color: rgba(255,251,240,1.00);
	border: solid 2px rgba(244,182,0,1.00);
 display: flex;
	flex-wrap: nowrap;
}


/*
================================================================================================================
タイトル
================================================================================================================
*/

.title{  width:100%;
	max-width: 1000px;
	overflow: hidden;
  margin:0 auto;
	position: inherit;
	padding: 0px;
    background-color: rgba(0,30,60,0.0);
}


/*
================================================================================================================
スライダー
================================================================================================================
*/

.block_01 {
	width:100%;
	margin: 0px auto 0px;
	padding: 0px;
}
ul{
    margin: 0;
    padding: 0;
    list-style-type: none;
}

.group{
    width: 640px;
    margin: 0 auto;
}

.slide_block.bg01{ background-color: rgba(181,50,132,1.00);}
.slide_block.bg02{ background-color: rgba(55,168,171,1.00);}
.slide_block.bg03{ background-color: rgba(230,125,6,1.00); }
.slide_block.bg04{ background-color: rgba(115,105,168,1.00); }
.slide_block.bg05{ background-color: rgba(204,160,47,1.00); }
.slide_block.bg06{ background-color: rgba(210,194,150,1.00); }
.slide_block.bg07{ background-color: rgba(71,127,76,1.00); }
.slide_block.bg08{ background-color: rgba(178,42,30,1.00); }
.slide_block.bg09{ background-color: rgba(181,50,132,1.00); }
.slide_block.bg10{ background-color: rgba(55,168,171,1.00); }
.slide_block.bg11{ background-color: rgba(230,125,6,1.00); }
.slide_block.bg12{ background-color: rgba(115,105,168,1.00); }
.slide_block.bg13{ background-color: rgba(204,160,47,1.00); }
.slide_block.bg14{ background-color: rgba(210,194,150,1.00); }
.slide_block.bg15{ background-color: rgba(71,127,76,1.00); }

.slide_block.bg01,
.slide_block.bg02,
.slide_block.bg03,
.slide_block.bg04,
.slide_block.bg05,
.slide_block.bg06,
.slide_block.bg07,
.slide_block.bg08,
.slide_block.bg09,
.slide_block.bg10,
.slide_block.bg11,
.slide_block.bg12,
.slide_block.bg13,
.slide_block.bg14,
.slide_block.bg15{
	/*background-image: linear-gradient(0deg, transparent 9px, rgba(255,255,255,0.50) 10px), linear-gradient(90deg,  transparent 9px, rgba(255,255,255,0.20) 10px);*/
	background-size: 10px 10px;
	background-position: center center;
	width:calc(100% - 10px); 
	margin: 5px;
}

.slide_block p span{
    display: table-cell;
    vertical-align: middle;
}

.slider_main{
    margin: 0px;
}

.slider_main .slide{
    width: 100%;
}
.slide_block .slide_box{
	position: relative;
	width:calc(100% - 0px); 
    height:calc(100% - 0px); 
	padding:0;
	margin: 0;
	background-color: rgba(255,255,255,1.00);
	display: flex;
	flex-wrap: nowrap;
	border: solid 2px rgba(244,182,0,1.00);
	overflow: hidden;
}
.slide_bg{
	position: absolute;
	width:100%; 
    height: 100%;
	padding:0;
	margin: 0;
	background-color: rgba(30,30,30,1.00);
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	display: flex;
	flex-wrap: nowrap;
}
.slide_bg.img01{background-image: url("../chara/img/chara_bg01.jpg");}
.slide_bg.img02{background-image: url("../chara/img/chara_bg02.jpg");}
.slide_bg.img03{background-image: url("../chara/img/chara_bg03.jpg");}
.slide_bg.img04{background-image: url("../chara/img/chara_bg04.jpg");}
.slide_bg.img05{background-image: url("../chara/img/chara_bg05.jpg");}
.slide_bg.img06{background-image: url("../chara/img/chara_bg06.jpg");}
.slide_bg.img07{background-image: url("../chara/img/chara_bg07.jpg");}
.slide_bg.img08{background-image: url("../chara/img/chara_bg08.jpg");}
.slide_bg.img09{background-image: url("../chara/img/chara_bg09.jpg");}
.slide_bg.img10{background-image: url("../chara/img/chara_bg10.jpg");}
.slide_bg.img11{background-image: url("../chara/img/chara_bg11.jpg");}
.slide_bg.img12{background-image: url("../chara/img/chara_bg12.jpg");}
.blur{
	-webkit-transition: all 1.0s;/*chrome&safari*/
    -moz-transition: all 1.0s;/*firefox*/
    -ms-transition: all 1.0s;/*ie*/
    transition: all 1.0s;
    filter: blur(3px);
    &.scrollin{
      filter: blur(0);
    }
}
.slide_block .img_all{
	position: absolute;
    height: 100%;
	padding:0;
	margin: 0;
	overflow: hidden;
	width: 60%; 
}
.slide_block .img_all img{width: 100%;}

.slide_block .text_all{
	position: relative;
    height: 100%;
    min-height: 640px;
	padding:20px 20px 0px  0;
	margin:0 0 0 auto;
	width:60%; 
	right: 0px;
	background-color: rgba(30,30,30,0.00);
	display: flex;
	flex-wrap: wrap;
align-content: center;
	filter: drop-shadow(5px 5px 2px rgba(7, 32, 4, .3));
}
.text_all .profile{
	width:calc(100% - 2%);
	min-height: 20%;
	margin: 1%;
	padding: 0px;
	background-color: rgba(255,255,255,0.95);
	border-radius: 6px;
	outline: solid 1px rgba(200,200,200,1.00);
}
.text_all .box01{
	width:calc(100% - 0%);
	min-height: 8%;
	margin: 1% 0;
	padding: 0px;
	background-color: rgba(255,255,255,0.00);
	border-radius: 0px;
	outline: solid 0px rgba(200,200,200,0.00);
}
.text_all .box01 .copy{
	width:180%;
	margin: 0 0 0 -80%;
	padding: 0;
	display: flex;
	justify-content: center;
    flex-wrap: nowrap;
}
.text_all .box01 img{
	width:100%;
	margin: 0;
	padding: 0;
}
.text_all .box02{
	width:calc(100% - 2%);
	min-height: 6%;
	margin: 1%;
	padding: 0px;
	background-color: rgba(255,255,255,0.95);
	border-radius: 6px;
	outline: solid 1px rgba(200,200,200,1.00);
}
.text_all .box03{
	width:calc(45% - 2%);
	min-height: 6%;
	margin: 1%;
	padding: 0px;
	background-color: rgba(255,255,255,0.95);
	border-radius: 6px;
	outline: solid 1px rgba(200,200,200,1.00);
}
.text_all .name{
	width:calc(100% - 2%);
	min-height: 10%;
	margin: 1%;
	padding: 0px;
	background-color: rgba(255,255,255,0.95);
	border-radius: 6px;
	outline: solid 1px rgba(200,200,200,1.00);
}
.obi_01{
	width: 100%;
	min-height: 10px;
	background-color: rgba(60,60,60,0.00);
	background-image: url("../chara/img/obi_03.png");
	background-repeat: repeat-y;
	background-position: left top;
	background-size: 100%;
	border-radius: 6px 6px 0 0;
}
.sub_title_01{
	width: 100%;
	height: auto;
	margin: 0;
	padding: 1px 10px;
	background-image: url("../chara/img/obi_01.png");
	background-repeat: repeat-y;
	background-position: left top;
	background-size: 100%;
	font-size: 18px;
	font-weight: bold;
	color: rgba(255,255,255,1.00);
	border-radius:6px 6px 0 0;
}
.sub_title_02{
	width: 100%;
	height: auto;
	margin: 0;
	padding: 1px 10px;
	background-image: url("../chara/img/obi_02.png");
	background-repeat: repeat-y;
	background-position: left top;
	background-size: 100%;
	font-size: 18px;
	font-weight: bold;
	color: rgba(255,255,255,1.00);
	border-radius:6px 6px 0 0;
}
.sub_title_03{
	width: 100%;
	height: auto;
	margin: 0;
	padding: 1px 10px;
	background-image: url("../chara/img/obi_03.png");
	background-repeat: repeat-y;
	background-position: left top;
	background-size: 100%;
	font-size: 12px;
	font-weight: 100;
	color: rgba(255,255,255,1.00);
	border-radius:6px 6px 0 0;
}
.name_flex{
	width: 100%;
	height: auto;
	display: flex;
	padding: 15px 2px;
}
.text_type{
	width: 100%;
	height: auto;
	margin: 0;
	padding: 0px 10px 2px 10px;
	color: rgba(60,60,60,1.00);
	font-size: 16px;
	line-height: 16px;
	font-weight:bold;
	text-align: center;
}
.text_name{
	width: 100%;
	height: auto;
	margin: 0;
	padding: 5px 2px 6px 10px;
	color: rgba(60,60,60,1.00);
}
.flex01 .text_name{
	font-size: 28px;
	line-height: 30px;
	font-weight: bold;
	text-align: center;
}
.flex02 .text_name{
	font-size: 40px;
	line-height: 30px;
	font-weight: bold;
	text-align: center;
}
.text_name span{vertical-align: -4px;}

.text_name2{
	width: 100%;
	height: auto;
	margin: -7px 0 0 0;
	padding: 0px 10px 10px 10px;
	color: rgba(60,60,60,1.00);
	font-size: 16px;
	line-height: 20px;
	font-weight:bold;
}
.text_cv{
	width: 100%;
	height: auto;
	margin: 0;
	padding: 10px;
	color: rgba(60,60,60,1.00);
	font-size: 26px;
	line-height: 36px;
	font-weight: bold;
}
.text_01{
	width: 100%;
	height: auto;
	margin: 0;
	padding: 10px;
	color: rgba(60,60,60,1.00);
	font-size: 24px;
	line-height: 28px;
	font-weight: bold;
}
.text_02{
	width: 100%;
	height: auto;
	margin: 0;
	padding: 10px;
	color: rgba(30,30,30,1.00);
	font-size: 20px;
	line-height: 34px;
	letter-spacing:0.02em;
	font-weight: 100;
}
@media screen and (max-width:1199px) {
.slide_block .text_all{
	position: relative;
    height: 100%;
	padding:2vw 2vw 0vw  0;
	margin:0 0 0 auto;
	width:50%; 
    min-height: 54vw;
	right: 0px;
	background-color: rgba(30,30,30,0.00);
	display: flex;
	flex-wrap: wrap;
align-content:center;
}
.text_name{
	width: 100%;
	height: auto;
	margin: 0;
	padding: 0.4vw 0.4vw 0.8vw 1.2vw;
}
.flex01 .text_name{
	font-size: 2.2vw;
	line-height: 1.6vw;
	font-weight: bold;
	text-align: center;
}
.flex02 .text_name{
	font-size: 3.2vw;
	line-height: 1.6vw;
	font-weight: bold;
	text-align: center;
}
.text_cv{
	font-size: 2.2vw;
	line-height: 3.4vw;
	font-weight: bold;
}
.text_02{
	width: 100%;
	height: auto;
	margin: 0;
	padding: 10px;
	color: rgba(30,30,30,1.00);
	font-size: 1.6vw;
	line-height: 3.0vw;
	letter-spacing:0.02em;
	font-weight: 200;
}
}

@media screen and (max-width:799px) {
.text_all .name{width:calc(100% - 2%); margin: 0% 1% 1% 1%;}
.text_all .box01{width:calc(100% - 2%); margin: 1% 1% 1% 1%;}
.text_all .box02{width:calc(100% - 2%); margin: 1% 1% 1% 1%;}
.text_all .box03{width:calc(40% - 2%); margin: 1% 1% 1% 1%;}
.text_all .profile{width:calc(100% - 2%); margin: 1% 1% 1% 1%;}
.sub_title_01{font-size: 1.8vw; padding: 1px 5px;}
.sub_title_02{font-size: 1.8vw; padding: 1px 5px;}
.sub_title_03{font-size: 1.8vw; padding: 1px 5px;}
.name_flex{ padding: 5px 2px;}
.text_type{
	padding: 2px 6px 2px 6px;
	font-size: 14px;
	line-height: 14px;
}
.text_name{
	width: 100%;
	height: auto;
	margin: 0;
	padding: 1.6vw 0.4vw 1.8vw 1.2vw;
}
.flex01 .text_name{
	font-size: 2.2vw;
	line-height: 1.6vw;
	font-weight: bold;
	text-align: center;
}
.flex02 .text_name{
	font-size: 3.2vw;
	line-height: 1.6vw;
	font-weight: bold;
	text-align: center;
}
	
.text_name span{vertical-align: -2px;}

.text_name2{
	padding: 0px 6px 3px 6px;
	margin-top: -4px;
	font-size: 12px;
	line-height: 20px;
}
.text_cv{
	font-size: 2.2vw;
	line-height: 3.4vw;
	font-weight: bold;
}
.text_01{
	padding: 6px;
	font-size: 12px;
	line-height: 16px;
}
.text_02{
	padding: 6px;
	font-size: 1.7vw;
	line-height: 3.2vw;
	letter-spacing:0.02em;
	font-weight: 200;
}
}

@media screen and (max-width:639px) {
.slide_block .slide_box{
	flex-wrap: wrap;
	align-items: flex-end;
}
.slide_block .img_all{
	position: relative;
    height:148vw;
	padding:0;
	margin:0 0 0 0;
	overflow: hidden;
	width: 100%; 
}
.slide_block .img_all img {
    width: 128%;
}
.slide_block .text_all{
	position: absolute;
    height: auto;
	margin:0 auto;
	padding:5px;
	width:100%; 
	right: auto;
	display: flex;
}
.text_all .name{width:calc(100% - 2%); margin: 0% 1% 1% 1%;}
.text_all .box01{width:calc(100% - 2%); margin: 1% 1% 1% 1%;}
.text_all .box01 .copy{width:100%; margin: 0; padding: 0;}
.text_all .box02{width:calc(100% - 2%); margin: 1% 1% 1% 1%;}
.text_all .box03{width:calc(40% - 2%); margin: 1% 1% 1% 1%;}
.text_all .profile{width:calc(100% - 2%); margin: 1% 1% 1% 1%;}
.sub_title_01{font-size: 3vw; padding: 1px 5px;}
.sub_title_02{font-size: 14px; padding: 1px 5px;}
.sub_title_03{font-size: 14px; padding: 1px 5px;}
.text_type{
	padding: 6px 2px 2px 10px;
	font-size: 14px;
	line-height: 16px;
}
.text_name{
	width: 100%;
	height: auto;
	margin: 0;
	padding: 1.6vw 0.4vw 1.8vw 1.2vw;
}
.flex01 .text_name{
	font-size: 4.2vw;
	line-height: 2.6vw;
	font-weight: bold;
	text-align: center;
}
.flex02 .text_name{
	font-size: 5.6vw;
	line-height: 2.6vw;
	font-weight: bold;
	text-align: center;
}
.text_name span{vertical-align: -3px;}
.text_name2{
	padding: 0px 6px 3px 6px;
	margin-top: -4px;
	font-size: 3vw;
	line-height: 4vw;
}
.text_cv{
	padding: 1.5vw;
	font-size: 4vw;
	line-height: 5vw;
}
.text_01{
	padding: 6px;
	font-size: 18px;
	line-height: 28px;
}
.text_02{
	padding: 10px;
	font-size: 3.0vw;
	line-height: 4.8vw;
	letter-spacing:0.02em;
	font-weight: 200;
}
}



.slider_main p{
    display: table;
    width: 100%;
    height: 480px;
    color: #fff;
    text-align: center;
    font-size: 20px;
    font-size: 2.0rem;
    margin: 0;
}

.slider_thumb .slide{
    width: 100%;
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
}

.slider_thumb .slide .slide_block{
    width: calc((100% / 15) - 10px);
    height: auto;
    margin: 5px;
    cursor: pointer;
	border-radius: 3vw;
	outline: solid 2px rgba(244, 182, 0, 1.00);
	overflow: hidden;
}
.slider_thumb .slide .slide_block img{
    display: block;
    width: 100%;
    margin: 0;
	padding: 0;
}
@media screen and (max-width:799px) {
.slider_thumb .slide .slide_block{
    width: calc((100% / 15) - 10px);
	border-radius: 5vw;
    margin: 5px;
}
}
@media screen and (max-width:639px) {
.slider_thumb .slide .slide_block{
    width: calc((100% / 8) - 8px);
	border-radius: 8vw;
    margin: 4px;
}
}

.slider_thumb .slide .slide_block:hover,
.slider_thumb .slide .slide_block.thumbnail-current{
    opacity: 1.0;
	border: solid 0px rgba(255,29,162,1.00);
	outline:  solid 3px rgba(255,29,162,1.00);
}

.clearfix {
    zoom: 1;
}
.clearfix:after {
    display: block;
    clear: both;
    content: '';
}
*:after {
    display: block;
    clear: both;
}


/* slick */
.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; }
/* Arrows */
.slick-prev,
.slick-next{
    font-size: 0;
    line-height: 0;
    position: absolute;
    top: 50%;
    display: block;
    width: 30px;
    height: 50px;
	background-color: rgba(30,30,30,1.00)!important;
    padding: 0;
    cursor: pointer;
    color:  transparent;
	border: solid 1px rgba(10,220,240,1.00);
    outline: none;
	z-index: 100;
}
.slick-prev:hover,
.slick-next:hover{
    color: rgba(10,220,240,1.00);
    outline: none;
	background-color: rgba(20,120,140,1.00)!important;
}
.slick-prev{
    left: -11px;
}
.slick-next{
    right: -11px;
}
.slick-prev:after{
    content: "◀";
	text-align: center;
    font-size: 20px;
    line-height: 20px;
	color: rgba(10,220,240,1.00)!important;
}
.slick-next:after{
    content: "▶";
	text-align: center;
    font-size: 20px;
    line-height: 20px;
	color: rgba(10,220,240,1.00)!important;
}
.slick-prev:hover:after,
.slick-next:hover:after{
    color: rgba(10,220,240,1.00);
}
@media screen and (max-width:799px) {
.slick-prev,
.slick-next{
    width: 25px;
    height: 40px;
}
.slick-prev:after, .slick-next:after{
    font-size: 15px;
    line-height: 15px;
}
}
@media screen and (max-width:479px) {
.slick-prev,
.slick-next{
    width: 20px;
    height: 40px;
}
.slick-prev:after, .slick-next:after{
    font-size: 15px;
    line-height: 15px;
}
}

/* content_slider */
.content_slider{
    float: left;
    width: 410px;
}

.content_comment{
    float: right;
    width: 410px;
}