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

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

コスプレ
 
---------------------------------- */
.cos_bg {
margin-bottom: 3%;
overflow: hidden;
}
.cos_type {
display: block;
width: 16%;
height: auto;
padding: 0px;
float: left;
margin: 0 0.8% 0.8% 0;
line-height: 35px;
color: #1b1b1b;
text-align: center;
font-size: calc(4 * ((100vw - 320px) / 1600) + 12px);
font-weight: bold;
background-color: #fff;
box-shadow: inset 0 0 2px rgba(0,0,0,.3);
outline: none;
}
.cos_type:nth-child(6n) {margin-right: 0;}
.cos_type:hover{ background-color: #fcd1e5; }
.cos_icon_guide {
margin-bottom: 3%;
overflow: hidden;
}
.con_icon  {
display: block;
width: 162px;
height: 35px;
padding: 0;
float: left;
line-height: 2.0em;
text-align: left;
font-size: calc(4 * ((100vw - 320px) / 1600) + 12px);
font-weight: bold;
}
.con_icon > div {
border: 1px solid #666;
border-radius: 0.2em;
-webkit-border-radius: 0.2em;
-moz-border-radius: 0.2em;    
color: #fff;
font-size: calc(4 * ((100vw - 320px) / 1600) + 10px);
width: 30px;
height: 30px;
line-height: 30px;
text-align: center;
margin-right: 5%;
float: left;
}
.cos_icon_mov {
background: #00f9c0;
background: -moz-linear-gradient( #c9fef1 0%, #00f9c0 100%);
background: -webkit-gradient(linear, left top, left bottom, from(#c9fef1), to(#00f9c0));
background: -webkit-linear-gradient( #c9fef1 0%, #00f9c0 100%);
background: -o-linear-gradient( #c9fef1 0%, #00f9c0 100%);
background: linear-gradient( #c9fef1 0%, #00f9c0 100%);
text-shadow: 
    #15a785 2px 0px,  #15a785 -2px 0px,
    #15a785 0px -2px, #15a785 0px 2px,
    #15a785 2px 2px , #15a785 -2px 2px,
    #15a785 2px -2px, #15a785 -2px -2px,
    #15a785 1px 2px,  #15a785 -1px 2px,
    #15a785 1px -2px, #15a785 -1px -2px,
    #15a785 2px 1px,  #15a785 -2px 1px,
    #15a785 2px -1px, #15a785 -2px -1px;       
}
.cos_icon_free {
background: #9b44c4;
background: -moz-linear-gradient( #db8ffe 0%, #9b44c4 100%);
background: -webkit-gradient(linear, left top, left bottom, from(#db8ffe), to(#9b44c4));
background: -webkit-linear-gradient( #db8ffe 0%, #9b44c4 100%);
background: -o-linear-gradient( #db8ffe 0%, #9b44c4 100%);
background: linear-gradient( #db8ffe 0%, #9b44c4 100%);
text-shadow: 
    #902390 2px 0px,  #902390 -2px 0px,
    #902390 0px -2px, #902390 0px 2px,
    #902390 2px 2px , #902390 -2px 2px,
    #902390 2px -2px, #902390 -2px -2px,
    #902390 1px 2px,  #902390 -1px 2px,
    #902390 1px -2px, #902390 -1px -2px,
    #902390 2px 1px,  #902390 -2px 1px,
    #902390 2px -1px, #902390 -2px -1px;      
}
.cos_icon_deli {
background: #99cc00;
background: -moz-linear-gradient( #dfefaf 0%, #99cc00 100%);
background: -webkit-gradient(linear, left top, left bottom, from(#dfefaf), to(#99cc00));
background: -webkit-linear-gradient( #dfefaf 0%, #99cc00 100%);
background: -o-linear-gradient( #dfefaf 0%, #99cc00 100%);
background: linear-gradient( #dfefaf 0%, #99cc00 100%);
text-shadow: 
    #8dac2d 2px 0px,  #8dac2d -2px 0px,
    #8dac2d 0px -2px, #8dac2d 0px 2px,
    #8dac2d 2px 2px , #8dac2d -2px 2px,
    #8dac2d 2px -2px, #8dac2d -2px -2px,
    #8dac2d 1px 2px,  #8dac2d -1px 2px,
    #8dac2d 1px -2px, #8dac2d -1px -2px,
    #8dac2d 2px 1px,  #8dac2d -2px 1px,
    #8dac2d 2px -1px, #8dac2d -2px -1px;    
}
.cos_list { margin-bottom: 5%; }

div.cos_new_bg { background-color: #fb9ebd !important; display: block; }
/*#costop,#cos_new,#cos_works,#cos_val,#cos_jk,#cos_swim,#cos_sexy,#cos_lang,#cos_jan,#cos_wife,#cos_option,#cos_kindan {
    margin-top:-100px;
    padding-top:100px;
}*/

.cosFlow{
width: 100%;
margin: 0;
box-sizing: border-box;
overflow: hidden;
}
.textLeft{width: 50%; float: left; color: #FFF;}
.imgRight{width: 50%; float: left;}
.imgRight .cosMovieList {}
.imgRight .cosMovieRand{
    position: relative;
    width: 100%;
    height: 100%;
    padding: 75% 0 0;
    text-align: center;
}
.imgRight .cosMovieRand > a{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0;
    margin: 0;
    padding: 0;
}
.imgRight .cosMovieRand a > div {
 position: relative;
    width: 100%;
    height: 100%;
  
}
.imgRight .cosMovieRand a > div img {
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
margin: auto; 
width:auto;
height:auto;
max-width:100%;
max-height:100%;    
}
.imgRight .cosMovieRand:first-child { display: inline!important; }

.cosPriceCaps{ color: #FFF; line-height: 2.0em;}
.cosPriceCaps span{ color: #F19D00;}
.cosplayList {
    width: 100%;
    /*padding: 0 5px;*/
    box-sizing: border-box;
    display:-webkit-box;
    display:-moz-box;
    display:-ms-box;
    display:-webkit-flexbox;
    display:-moz-flexbox;
    display:-ms-flexbox;
    display:-webkit-flex;
    display:-moz-flex;
    display:-ms-flex;
    display:flex;
    -webkit-box-lines:multiple;
    -moz-box-lines:multiple;
    -webkit-flex-wrap:wrap;
    -moz-flex-wrap:wrap;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;
}
.cosplayList .cosplayCell {
	/*box-shadow: 0 5px 15px rgba(0,0,0,.2);*/
	line-height: 150%;
	font-size: calc(2 * ((100vw - 320px) / 1600) + 12px);
	/*background-color: #1b1b1b;*/
	position: relative;
	text-align: center;
    width: calc(91%/4);
    margin: 0 3% 3% 0;
}

.cosplayList a { /*color: #f3f1f1;*/ display: block; /*padding: 3%;*/}
.cosplayList .listicon01 {position: absolute; bottom: 0;}
.cosplayList .listicon01 span{ padding: 0 4%;}
.cosName{ line-height: 1.4em; padding: 3% 0; margin-top: 2%;}
.cosplayList .imageWrap:before {
    padding-top: calc(3/2*100%)!important;
}

@media screen and (min-width: 960px) {
.cosplayList .cosplayCell:nth-child(4n) {margin-right: 0;}
}

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

タブレット
 
------------------------------------------------------------- */
@media screen and (min-width: 750px) and (max-width: 960px) {
.cos_type {
	width: 33%;
    margin: 0 0.5% 0.5% 0;
}
.cos_type:nth-child(3n) { margin-right: 0;}
.con_icon  {
	width: 33%;
	height: auto;
    margin: 0 0.5% 0 0;
	line-height: auto;
}
.con_icon:nth-child(3n) { margin-right: 0;}    
.con_icon > div {
	width: 25px;
	height: 25px;
	line-height: 25px;
} 
.cosplayList .cosplayCell  {width: calc(94%/3); }
.cosplayList .cosplayCell:nth-child(3n) {margin-right: 0;}
    
}
/*-------------------------------------------------------------

スマホ
 
------------------------------------------------------------- */
@media screen and (max-width: 750px) {
.cos_type {
	width: 33%;
    margin: 0 0.5% 0.5% 0;
}
.cos_type:nth-child(3n) { margin-right: 0;}
.con_icon  {
	width: 33%;
	height: auto;
    margin: 0 0.5% 0 0;
	line-height: auto;
}
.con_icon:nth-child(3n) { margin-right: 0;}
.con_icon > div {
	width: 20px;
	height: 20px;
	line-height: 20px;
}
.cosplayList .cosplayCell { width: 48.5%; }
.textLeft{float: none; width: 100%;}
.imgRight{float: none; width: 100%; margin-top: 5%;}
.cosplayList .cosplayCell:nth-child(2n) {margin-right: 0;}
}