@charset "utf-8";

/* ------ FontAwesome ------ */

@font-face {
	font-family: 'FontAwesome';
	src: url('../font/FontAwesome/fontawesome-webfont.eot?v=4.0.3');
	src: url('../font/FontAwesome/fontawesome-webfont.eot?#iefix&v=4.0.3') format('embedded-opentype'), url('../font/FontAwesome/fontawesome-webfont.woff?v=4.0.3') format('woff'), url('../font/FontAwesome/fontawesome-webfont.ttf?v=4.0.3') format('truetype'), url('../font/FontAwesome/fontawesome-webfont.svg?v=4.0.3#fontawesomeregular') format('svg');
	font-weight: normal;
	font-style: normal
}

/* ------ common ------ */

* {
	margin: 0;
	padding: 0;
	word-break: normal;
	line-break: strict;
	outline: none;
	box-sizing: border-box
}

html {
	font-family: 'Noto Sans JP', sans-serif;
	font-size: 62.5%;
	font-style: normal;
	line-height: 1.6;
	font-feature-settings: "palt";
	-webkit-overflow-scrolling: touch
}
 
body {                                                                                                                    
	height: 100%; 
	color: #000;
	font-size: 1.2rem;
	font-weight: 500;
	background: #fff;
	overflow-x: hidden;
	overflow-y: scroll;
    -webkit-text-size-adjust: 100%
}

h1, h2, h3, h4, h5, h6 {
	line-height: 1.0
}

img { max-width: 100% }
ol, ul, li {
  list-style: none
}

table {
	border-spacing: 0;
	border-collapse: collapse
}

form label { cursor: pointer }
button,
textarea,
input[type="text"],
input[type="submit"] {
	border-radius: 0;
	-webkit-appearance: none
}

a {
	color: #000;
	text-decoration: none;
	transition: all 0.3s ease-in-out
}

a:hover { transition: all 0.3s ease-in-out }
a:focus { outline: none }
a,
input[type=radio],
input[type=checkbox],
input[type=submit],
button, select {
  cursor: pointer;
  transition: all 0.3s ease-in-out;
}

a img { border: none }
.cf:after {
	content: '';
	display: block;
	clear: both
}

::-moz-selection {
	color: #fff;
	background: #000
}

::selection {
	color: #fff;
	background: #000
}

::-webkit-input-placeholder { color: #999 }
::-moz-placeholder {
	color: #999;
	opacity: 1
}

:-ms-input-placeholder { color: #999 }
.red { color: #f00 }
.bold { font-weight: 600 }


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

header .inner {
	width: 1000px;
	font-size: 0;
	margin: 0 auto
}

header .logo {
	width: 200px;
	vertical-align: top;
	margin-right: 10px;
	display: inline-block
}

header .headerMain {
	width: 790px;
	vertical-align: top;
	display: inline-block
}

header .headerTop { border: 2px solid #000 }
header .headerTopObi {
	text-align: right;
	padding: 3px 10px 6px;
	background: #000
}

header .headerTopInner { font-size: 0 }
header .headerTopTitle {
	width: 460px;
	padding: 4px 0;
	display: inline-block
}
	
header .headerTopBtn {
	width: 284px;
	margin-top: 6px;
	float: right
}

header .headerTopBtn ul { font-size: 0 }
header .headerTopBtn li:nth-child(1) {
	width: 109px;
	vertical-align: top;
	margin-right: 10px;
	display: inline-block
}

header .headerTopBtn li:nth-child(2) {
	width: 145px;
	vertical-align: top;
	margin-right: 20px;
	display: inline-block
}

header .headerTxtTop {
	font-size: 0;
    margin-top: 10px
}

header .headerTxtTitle {
    width: 550px;
    vertical-align: middle;
	display: inline-block
}

header .headerTxtTitle h1 {
	font-size: 2.4rem;
	font-weight: 900
}

header .headerTxtTitle.regist h1 { font-size: 2rem }
header .headerRss {
	width: 240px;
	font-size: 1.4rem;
	vertical-align: middle;
	text-align: right;
	display: inline-block
}

header .headerRss a {
	color: #11c;
	text-decoration: underline;
	position: relative
}

header .headerRss a::before {
	content: "";
    width: 16px;
    height: 16px;
    margin: auto;
    background: url(../img/rss_icon.gif) no-repeat;
    background-size: contain;
    position: absolute;
    top: 0;
    bottom: 0;
    left: -26px
}

header .headerTxt {
    font-size: 1.2rem;
	line-height: 1.4;
    margin-top: 10px
}

body.ems header .headerTxt { font-size: 1.5rem }

@media screen and (min-width: 769px) {
	header .headerTopBtn .menu-btn { display: none }
}

@media screen and (max-width: 768px) {
	header .inner { width: 100% }
	header .logo { display: none }
	header .headerMain {
		width: 100%;
		display: block
	}

	header .headerTop {
		border: none;
		border-bottom: 1px solid #c1c1c1
	}

	header .headerTopObi { padding: 6px 4% }
	header .headerTopInner {
		width: 100%;
		height: 60px;
		padding: 6px 4% 6px 0;
		background: #fff
	}
	
	body.fixed header .headerTopInner {
		border-bottom: 1px solid #c1c1c1;
		position: fixed;
		top: 0;
		left: 0;
		z-index: 9999
	}
	
	header .headerTopTitle {
		width: calc(100% - 58px);
		vertical-align: middle;
		padding: 0;
		margin-right: 10px;
		display: inline-block
	}
	
	header .headerTopBtn {
		width: 48px;
		vertical-align: middle;
		text-align: center;
		margin-top: 0;
		display: inline-block;
		float: none
	}

	header .headerTxtTitle {
		width: 100%;
		padding: 0 4%;
		display: block
	}

	body.fixed header .headerTxtTitle { padding-top: 60px }
	header .headerTxtTitle h1 { font-size: 1.8rem }
	header .headerTxtTitle.regist h1 {
		font-size: 1.8rem;
		line-height: 1.3
	}
	
	header .headerRss {
		width: 100%;
		padding: 0 4%;
		margin-top: 10px;
		display: block
	}

	header .headerTxt { padding: 0 4% }
	body.paging header .headerTxt,
	body.newrelease header .headerTxt,
	body.alltitle header .headerTxt,
	body.faq header .headerTxt,
	body.policy header .headerTxt,
	body.leagle header .headerTxt,
	body.cast header .headerTxt,
	body.contact header .headerTxt,
	body.contactForm header .headerTxt {
		display: none
	}
	
	
	/* menu trigger */
	
	header .headerTopBtn li:nth-child(3) a {
		height: 48px;
		line-height: 1;
		padding: 4px 0;
		border: 2px solid #1f1f1f;
		position: relative;
		display: block
	}
	
	.menu-trigger,
	.menu-trigger span {
		transition: all .4s;
		display: inline-block
	}
	
	.menu-trigger .menu-icon {
		width: 20px;
		height: 16px;
		margin: 0 auto 8px;
		position: relative;
		top: 3px;
		display: inline-block
	}
	
	.menu-trigger span {
		width: 100%;
		height: 2px;
		background: #1f1f1f;
		position: absolute;
		left: 0;
		border-radius: 4px
	}
	
	.menu-trigger span:nth-of-type(1) { top: 0 }
	.menu-trigger span:nth-of-type(2) { top: 7px }
	.menu-trigger span:nth-of-type(3) { bottom: 0 }
	.menu-trigger span:nth-of-type(1) { animation: menu-bar01 .75s forwards }
	.menu-trigger.active span:nth-of-type(1) { transform: translateY(7px) rotate(-45deg) }
	.menu-trigger.active span:nth-of-type(2) {
		left: 50%;
		animation: active-menu-bar02 .8s forwards;
		opacity: 0
	}
	
	@-webkit-keyframes active-menu-bar02 {
		100% { height: 0 }
	}
	
	@keyframes active-menu-bar02 {
		100% { height: 0 }
	}
	
	.menu-trigger.active span:nth-of-type(3) { transform: translateY(-7px) rotate(45deg) }
	.menu-trigger p { font-size: 1rem }

}


/* ------ nav ------ */

.headerNav nav {
	width: 100%;
	height: 40px;
	//background: url(../img/nav_bg.jpg) repeat;
	margin-top: 10px
}

.headerNav nav .inner {
	width: 1000px;
	margin: 0 auto;
	border-top: 1px solid #000;
    border-bottom: 1px solid #000;
	background: linear-gradient(#efefef,#c1c1c1)
}

.headerNav nav ul {
	width: 1000px;
  	display: -webkit-box;
  	display: -ms-flexbox;
  	display: flex;
  	-webkit-box-orient: horizontal;
  	-webkit-box-direction: normal;
  	-ms-flex-direction: row;
  	flex-direction: row;
	-ms-flex-pack: distribute;
	justify-content: space-evenly
}

.headerNav nav li {
	height: 40px;
	line-height: 40px;
	vertical-align: top;
	text-align: center;
	display: inline-block
}

.headerNav nav li a {
	color: #fff;
	font-size: 2rem;
	font-weight: 900;
	text-shadow: 1px 1px 0 #000, -1px -1px 0 #000, -1px 1px 0 #000, 1px -1px 0 #000, 0px 1px 0 #000, 0-1px 0 #000, -1px 0 0 #000, 1px 0 0 #000;
	display: block
}

.headerNav nav li a .red {
	text-shadow: 1px 1px 0 #fff, -1px -1px 0 #fff, -1px 1px 0 #fff, 1px -1px 0 #fff, 0px 1px 0 #fff, 0-1px 0 #fff, -1px 0 0 #fff, 1px 0 0 #fff;
	transition: all 0.3s ease-in-out
}

.headerNav nav li.current a,
.headerNav nav li a:hover {
	color: #000;
	text-shadow: 1px 1px 0 #fff, -1px -1px 0 #fff, -1px 1px 0 #fff, 1px -1px 0 #fff, 0px 1px 0 #fff, 0-1px 0 #fff, -1px 0 0 #fff, 1px 0 0 #fff
}

.headerNav nav li.current a .red,
.headerNav nav li a:hover .red {
	color: #fff;
	text-shadow: 1px 1px 0 #f00, -1px -1px 0 #f00, -1px 1px 0 #f00, 1px -1px 0 #f00, 0px 1px 0 #f00, 0-1px 0 #f00, -1px 0 0 #f00, 1px 0 0 #f00
}

@media screen and (max-width: 768px) {
	.headerNav nav { display: none }
}


/* drawer menu */

@media screen and (min-width: 769px) {
	.topNav { display: none }
}

@media screen and (max-width: 768px) {
	.topNav nav {
		width: 100%;
		height: 100%;
		padding-bottom: 200px;
		background: rgba(255,255,255,0.98);
		position: fixed;
		top: 82px;
		transition: top 0.3s;
		display: none;
		overflow-y: scroll;
		-webkit-overflow-scrolling: touch;
		z-index: 3
	}

	body.fixed .topNav nav { top: 60px }
	.topNav #spNav { width: 100% }
	.topNav #spNav > li {
		width: 100%;
		position: relative
	}
	
	.topNav #spNav > li + li { margin-top: 0 }
	.topNav #spNav .link {
		height: 50px;
		font-size: 1.4rem;
		line-height: 50px;
		padding: 0 10px 0 calc(4% + 30px);
		border-bottom: 1px dashed #c1c1c1;
		background: #efefef;
		position: relative;
		pointer-events: all;
		cursor: pointer
	}
	
	.topNav #spNav li:nth-child(1) .link::before {
		content: "";
		width: 20px;
		height: 20px;
		margin: auto;
		background: url(../img/icon/icon_menu.png) no-repeat;
		background-size: contain;
		position: absolute;
		top: 0;
		bottom: 0;
		left: 4%
	}
	
	.topNav #spNav li:nth-child(2) .link::before {
		content: "";
		width: 20px;
		height: 20px;
		margin: auto;
		background: url(../img/icon/icon_genre.png) no-repeat;
		background-size: contain;
		position: absolute;
		top: 0;
		bottom: 0;
		left: 4%
	}

	.topNav #spNav .link::after {
		content: '';
		width: 8px;
		height: 8px;
		margin: auto;
		border: 0;
		border-top: 1px solid #000;
		border-right: 1px solid #000;
		transform: rotate(135deg);
		position: absolute;
		top: 0;
		right: 14px;
		bottom: 0;
		transition: all 0.3s ease-in-out
	}
	
	.topNav #spNav .open .link::after { transform: rotate(315deg) }
	.topNav #spNav .submenu {
		padding-top: 0;
		margin-top: 0;
		border-top: none;
		display: none
	}

	.topNav #spNav li:nth-child(1) .submenu { display: block }
	.topNav #spNav li:nth-child(1) .submenu li,
	.topNav #spNav li:nth-child(2) .submenu li {
		width: 100%;
		height: 50px;
		font-size: 1.4rem;
		line-height: 50px;
		padding-left: 10px;
		margin-right: 0;
		margin-bottom: 0;
		border-bottom: 1px dashed #c1c1c1;
		display: block
	}

	.topNav #spNav li:nth-child(1) .submenu a,
	.topNav #spNav li:nth-child(2) .submenu a {
		padding-left: 10px;
		position: relative;
		display: block
	}
	
	.topNav #spNav li:nth-child(1) .submenu a::after,
	.topNav #spNav li:nth-child(2) .submenu a::after {
		content: '';
		width: 6px;
		height: 6px;
		margin: auto;
		border: 0;
		border-top: 1px solid #000;
		border-right: 1px solid #000;
		transform: rotate(45deg);
		position: absolute;
		top: 0;
		right: 14px;
		bottom: 0
	}
}


/* ------ content wrap ------ */

.contentWrap {
	width: 1000px;
	padding-top: 10px;
	margin: 0 auto
}

@media screen and (max-width: 768px) {
	.contentWrap { width: 100% }
}


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

.mainWrap {
	width: 760px;
	float: right
}

@media screen and (max-width: 768px) {
	.mainWrap {
		width: 100%;
		float: none
	}	
}


/* membership banner */

.membershipBn { margin-top: 20px }
.membershipBn img {
	width: 100%;
	display: block
}

@media screen and (max-width: 768px) {
	/*.membershipBn { padding: 0 4% }*/
	.membershipBn { display: none }
}


/* regist btn */

@media screen and (max-width: 768px) {
	.mainWrap .registBtn { margin-top: 20px }
	.mainWrap .registBtn img {
		margin: 0 auto;
		display: block
	}
}


/* affilliate info */

.affilliateInfo { margin-top: 20px }
.affilliateInfo .affilliateInfoTitle {
	height: 40px;
    padding: 5px 0;
    border: 1px solid #c1c1c1
}

.affilliateInfo .inner {
	padding: 10px;
	border: 1px solid #c1c1c1;
	border-top: none
}

.affilliateInfo .inner .imageWrap img {
	width: 100%;
    display: block
}

.affilliateInfo .inner .txtWrap {
	font-size: 1.4rem;
	margin-top: 10px
}

.affilliateInfo .inner .txtWrap a {
	color: #11c;
	text-decoration: underline
}

@media screen and (max-width: 768px) {
	.affilliateInfo { padding: 0 4% }
	.affilliateInfo .affilliateInfoTitle { height: auto }
	.affilliateInfo .inner .txtWrap { font-size: 1.2rem }
}


/* ------ side wrap ------ */

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

@media screen and (max-width: 768px) {
	.sideWrap {
		width: 100%;
		padding: 0 4%;
		display: block
	}
}


/* regist btn */

.sideWrap .registBtn { margin-top: 10px }
.sideWrap .registBtn img { display: block }

@media screen and (max-width: 768px) {
	.sideWrap .registBtn { display: none }
	/*.sideWrap .registBtn { margin-top: 20px }
	.sideWrap .registBtn img { margin: 0 auto }*/
}


/* menu wrap */

.sideWrap .menuWrap { margin-top: 20px }
.sideWrap .menuTitle {
	height: 30px;
	font-size: 1.4rem;
    font-weight: 600;
	line-height: 30px;
    letter-spacing: 0.05em;
    padding: 0 10px 0 36px;
	border: 1px solid #c1c1c1;
    background: #efefef;
	position: relative
}

.sideWrap .menuTitle::before {
    content: "";
    width: 20px;
    height: 20px;
    margin: auto;
    background: url(../img/icon/icon_menu.png) no-repeat;
    background-size: contain;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 10px
}

.sideWrap .menuWrap .listWrap {
	font-size: 1.4rem;
	padding: 10px;
    border: 1px solid #c1c1c1;
	border-top: none
}

.sideWrap .menuWrap .listWrap li + li { margin-top: 2px }
.sideWrap .menuWrap .listWrap a {
	padding-left: 14px;
	position: relative;
	display: block
}

.sideWrap .menuWrap .listWrap li a::before {
	content: "・";
	margin: auto;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0
}

.sideWrap .menuWrap .listWrap a:hover {
	color: #fff;
	background: #000
}

@media screen and (max-width: 768px) {
	.sideWrap .menuWrap { display: none }
}


/* genre wrap */

.sideWrap .genreWrap { margin-top: 20px }
.sideWrap .genreTitle {
	height: 30px;
	font-size: 1.4rem;
    font-weight: 600;
	line-height: 30px;
    letter-spacing: 0.05em;
    padding: 0 10px 0 36px;
	border: 1px solid #c1c1c1;
    background: #efefef;
	position: relative
}

.sideWrap .genreTitle::before {
    content: "";
    width: 20px;
    height: 20px;
    margin: auto;
    background: url(../img/icon/icon_genre.png) no-repeat;
    background-size: contain;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 10px
}

.sideWrap .genreWrap .listWrap {
	font-size: 1.4rem;
	padding: 10px;
    border: 1px solid #c1c1c1;
	border-top: none
}

.sideWrap .genreWrap .listWrap li + li { margin-top: 2px }
.sideWrap .genreWrap .listWrap a {
	padding-left: 14px;
	position: relative;
	display: block
}

.sideWrap .genreWrap .listWrap li a::before {
	content: "・";
	margin: auto;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0
}

.sideWrap .genreWrap .listWrap a:hover {
	color: #fff;
	background: #000
}

@media screen and (max-width: 768px) {
	.sideWrap .genreWrap { display: none }
}


/* affiliate wrap */

.sideWrap .affiliateWrap { margin-top: 20px }
.sideWrap .affiliateTitle {
	height: 30px;
	font-size: 1.4rem;
    font-weight: 600;
	line-height: 30px;
    letter-spacing: 0.05em;
    padding: 0 10px 0 36px;
	border: 1px solid #c1c1c1;
    background: #efefef;
	position: relative
}

.sideWrap .affiliateTitle::before {
    content: "";
    width: 20px;
    height: 20px;
    margin: auto;
    background: url(../img/icon/icon_guide.png) no-repeat;
    background-size: contain;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 10px
}

.sideWrap .affiliateWrap .imageWrap {
	padding: 10px;
	border: 1px solid #c1c1c1;
	border-top: none
}

.sideWrap .affiliateWrap .imageWrap img {
    margin: 0 auto;
    display: block
}

@media screen and (max-width: 768px) {
	.sideWrap .affiliateWrap { display: none }
}


/* search wrap */

.sideWrap .searchWrap { margin-top: 20px }
.sideWrap .searchTitle {
	height: 30px;
	font-size: 1.4rem;
    font-weight: 600;
	line-height: 30px;
    letter-spacing: 0.05em;
    padding: 0 10px 0 36px;
	border: 1px solid #c1c1c1;
    background: #efefef;
	position: relative
}

.sideWrap .searchTitle::before {
    content: "";
    width: 20px;
    height: 20px;
    margin: auto;
    background: url(../img/icon/icon_search.png) no-repeat;
    background-size: contain;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 10px
}

.sideWrap .searchWrap .formWrap fieldset {
    font-size: 1.4rem;
    padding: 0 10px 10px;
    margin-top: 10px;
    border: 1px solid #c1c1c1
}

.sideWrap .searchWrap .formWrap fieldset label { font-size: 1.2rem }
.sideWrap .searchWrap .formWrap fieldset input[type=text] {
    width: 100%;
    height: 30px;
    font-size: 1.4rem;
    padding: 10px;
    margin-top: 4px;
    border: 1px solid #000
}

.sideWrap .searchWrap .formWrap fieldset input[type=submit] {
    width: 100%;
    height: 30px;
    color: #fff;
    font-size: 1.2rem;
    margin-top: 4px;
    border: none;
    background: #999
}

@media screen and (max-width: 768px) {
	.sideWrap .searchWrap .formWrap fieldset input[type=text] { font-size: 1.6rem }
}


/* login wrap */

.sideWrap .loginWrap { margin-top: 20px }
.sideWrap .loginTitle {
	height: 30px;
	font-size: 1.4rem;
    font-weight: 600;
	line-height: 30px;
    letter-spacing: 0.05em;
    padding: 0 10px 0 36px;
	border: 1px solid #c1c1c1;
    background: #efefef;
	position: relative
}

.sideWrap .loginTitle::before {
    content: "";
    width: 20px;
    height: 20px;
    margin: auto;
    background: url(../img/icon/icon_login.png) no-repeat;
    background-size: contain;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 10px
}

.sideWrap .loginWrap .btnWrap {
	padding-top: 10px;
	border-right: 1px solid #c1c1c1;
	border-left: 1px solid #c1c1c1
}

.sideWrap .loginWrap .btnWrap img {
    margin: 0 auto;
	display: block
}

.sideWrap .loginWrap .listWrap {
	font-size: 1.2rem;
	padding: 10px;
    border: 1px solid #c1c1c1;
	border-top: none
}

.sideWrap .loginWrap .listWrap li + li { margin-top: 2px }
.sideWrap .loginWrap .listWrap a {
	padding-left: 14px;
	position: relative;
	display: block
}

.sideWrap .loginWrap .listWrap li a::before {
	content: "・";
	margin: auto;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0
}

.sideWrap .loginWrap .listWrap a:hover {
	color: #fff;
	background: #000
}

@media screen and (max-width: 768px) {
	.sideWrap .loginWrap .btnWrap a { width: calc(100% - 20px) }
}


/* mens recruit wrap */

.sideWrap .mensRecruit { margin-top: 20px }
.sideWrap .mensRecruit .imageWrap img {
	margin: 0 auto;
	display: block
}

.sideWrap .mensRecruit .txtWrap {
	font-size: 1.2rem;
	margin-top: 10px
}

.sideWrap .mensRecruit .txtWrap a {
	color: #11c;
	text-decoration: underline
}

@media screen and (max-width: 768px) {
	.sideWrap .mensRecruit { display: none }
}


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

footer { margin-top: 80px }
footer nav {
	padding: 20px;
	border-top: 1px solid #c1c1c1;
	border-bottom: 1px solid #c1c1c1;
	background: #efefef
}

footer #footerNav > li {
	width: 1000px;
	margin: 0 auto
}

footer #footerNav > li + li { margin-top: 40px }
footer #footerNav .link {
	height: 30px;
    font-size: 1.4rem;
    line-height: 30px;
    padding: 0 10px 0 30px;
    position: relative
}

footer #footerNav li:nth-child(1) .link::before {
    content: "";
    width: 20px;
    height: 20px;
    margin: auto;
    background: url(../img/icon/icon_menu.png) no-repeat;
    background-size: contain;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0
}

footer #footerNav li:nth-child(1) li:nth-child(5) a { color: #f00 }
footer #footerNav li:nth-child(2) .link::before {
    content: "";
    width: 20px;
    height: 20px;
    margin: auto;
    background: url(../img/icon/icon_genre.png) no-repeat;
    background-size: contain;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0
}

footer #footerNav .submenu {
	font-size: 0;
	padding-top: 10px;
	margin-top: 6px;
    border-top: 1px dashed #c1c1c1
}

footer #footerNav li:nth-child(1) .submenu li {
	width: 168px;
	font-size: 1.3rem;
	vertical-align: top;
	margin-right: 40px;
	margin-bottom: 10px;
	position: relative;
	display: inline-block
}

footer #footerNav li:nth-child(1) .submenu li::before { content: "・" }
footer #footerNav li:nth-child(1) .submenu a:hover {
	color: #f00;
	text-decoration: underline
}

footer #footerNav li:nth-child(1) .submenu li:nth-child(5) { margin-right: 0 }
footer #footerNav li:nth-child(1) .submenu li:nth-child(5n+9) { margin-right: 208px }
footer #footerNav li:nth-child(2) .submenu li {
	width: 168px;
	font-size: 1.3rem;
	vertical-align: top;
	margin-right: 40px;
	margin-bottom: 10px;
	position: relative;
	display: inline-block
}

footer #footerNav li:nth-child(2) .submenu li::before { content: "・" }
footer #footerNav li:nth-child(2) .submenu a:hover {
	color: #f00;
	text-decoration: underline
}

footer #footerNav li:nth-child(2) .submenu li:nth-child(5n) { margin-right: 0 }
footer .copyright {
	text-align: center;
	margin: 10px auto
}

footer .copyright small { font-size: 1.2rem }

@media screen and (min-width: 769px) {
	footer nav li ul { display: block !important }
	footer nav li:nth-child(2) { display: none }
	footer .copyright small {
		width: 974px;
		height: 40px;
		line-height: 40px;
		margin: 0 auto;
		background: url(../img/copy.jpg) no-repeat;
		display: block
	}
}

@media screen and (max-width: 768px) {
	footer { margin-top: 40px }
	footer nav { padding: 20px 4% }
	footer #footerNav > li { width: 100% }
	footer #footerNav > li + li { margin-top: 0 }
	footer #footerNav .link {
		height: 50px;
		font-size: 1.4rem;
		line-height: 50px;
		border-bottom: 1px dashed #c1c1c1;
		pointer-events: all;
		cursor: pointer
	}
	
	footer #footerNav > li:nth-child(1) .link { border-top: 1px dashed #c1c1c1 }
	footer #footerNav .link::after {
		content: '';
		width: 8px;
		height: 8px;
		margin: auto;
		border: 0;
		border-top: 1px solid #000;
		border-right: 1px solid #000;
		transform: rotate(135deg);
		position: absolute;
		top: 0;
		right: 14px;
		bottom: 0;
		transition: all 0.3s ease-in-out
	}
	
	footer #footerNav .open .link::after { transform: rotate(315deg) }
	footer #footerNav > ul > li:nth-child(1) .link { border-top: 1px solid #c1c1c1 }
	footer #footerNav .submenu {
		padding-top: 0;
		margin-top: 0;
		border-top: none;
		display: none
	}

	footer #footerNav li:nth-child(1) .submenu { display: block }
    footer #footerNav li:nth-child(1) li:nth-child(5) a { color: #000 }
    footer #footerNav li:nth-child(1) li:last-child a { color: #f00 }
    footer #footerNav li:nth-child(1) .submenu li:nth-child(5n+9) { margin-right: 0 }
	footer #footerNav li:nth-child(1) .submenu li,
	footer #footerNav li:nth-child(2) .submenu li {
		width: 100%;
		height: 50px;
		font-size: 1.4rem;
		line-height: 50px;
		margin-right: 0;
		margin-bottom: 0;
		border-bottom: 1px dashed #c1c1c1;
		background: #fff;
		display: block
	}
	
	footer #footerNav li:nth-child(1) .submenu li::before,
	footer #footerNav li:nth-child(2) .submenu li::before {
		content: ""
	}

	footer #footerNav li:nth-child(1) .submenu a,
	footer #footerNav li:nth-child(2) .submenu a {
		padding-left: 10px;
		display: block
	}
	
	footer #footerNav li:nth-child(1) .submenu a::after,
	footer #footerNav li:nth-child(2) .submenu a::after {
		content: '';
		width: 6px;
		height: 6px;
		margin: auto;
		border: 0;
		border-top: 1px solid #000;
		border-right: 1px solid #000;
		transform: rotate(45deg);
		position: absolute;
		top: 0;
		right: 14px;
		bottom: 0
	}
	
	footer .copyright { margin: 20px auto 60px }
}


/* ------ breadcrumb ------ */

.breadcrumbWrap { margin-top: 10px }
.breadcrumbWrap li { display: inline-block }
.breadcrumbWrap li::after {
    font-family: FontAwesome;
    content: "\f105";
    font-size: 1.6rem;
	margin: 0 8px
}

.breadcrumbWrap li:last-child:after { content: "" }
.breadcrumbWrap a {
	color: #11c;
	text-decoration: underline
}

@media screen and (max-width: 768px) {
	.breadcrumbWrap {
		width: 92%;
		margin: 10px auto 0
	}

	.breadcrumbWrap li { letter-spacing: 0 }
	.breadcrumbWrap li:after { margin: 0 4px }
	.breadcrumbWrap a { text-decoration: underline }
}


/* ------ to top ------ */

#toTop {
    position: fixed;
    bottom: 40px;
    right: 20px;
    z-index: 100
}

#toTop a {
    width: 50px;
    height: 50px;
    text-align: center;
    background: #000;
	position: relative;
    border-radius: 50%;
	display: block
}

#toTop a:hover { background: rgba(0, 0, 0, 0.8) }
#toTop a::before {
	content: '';
    width: 12px;
    height: 12px;
    margin: auto;
    border: 0px;
    border-top: solid 2px #fff;
    border-right: solid 2px #fff;
    transform: rotate(315deg);
    position: absolute;
    top: 0;
	right: 0;
	bottom: 0;
    left: 0
}

@media screen and (max-width: 768px) {
	#toTop { display: none }
}


/* ------ fixed btn ------ */

@media (max-width: 768px) {
	.footerBtn {
		width: 100%;
		height: 40px;
		position: fixed;
		bottom: 0;
		right: 0;
		z-index: 9999
	}
	
	.footerBtn ul { font-size: 0 }
	.footerBtn li {
		width: 50%;
		height: 40px;
		line-height: 36px;
		vertical-align: middle;
		text-align: center;
		display: inline-block
	}
	
	.footerBtn li:nth-child(1) a {
		color: #fff;
		font-size: 1.4rem;
		border: 2px solid #db0000;
		background: #db0000;
		display: block
	}
	
	.footerBtn li:nth-child(2) a {
		color: #ff9933;
		font-size: 1.4rem;
		border: 2px solid #ff9933;
		background: #fff;
		display: block
	}
}


/* ------ kaitori form ------ */

.kaitoriForm {
    padding: 20px;
    margin-top: 20px;
    border: 1px solid #c1c1c1
}

.kaitoriForm .title {
    margin-bottom: 30px;
    border-bottom: 2px solid #000;
    position: relative
}
    
.kaitoriForm .title::before {
    content: "";
    width: 30px;
    height: 30px;
    margin: auto;
    background: url(../img/pen.png) no-repeat;
    background-size: contain;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 10px
}
    
.kaitoriForm .title p {
    font-size: 2.4rem;
    font-weight: 500;
    letter-spacing: 0.06em;
    line-height: 40px;
    padding-left: 50px;
}
    
.kaitoriForm .txt p {
    font-size: 1.4rem;
    letter-spacing: 0.09em
}
    
.kaitoriForm .txt p + p { margin-top: 10px }
.kaitoriForm .customerWrap,
.kaitoriForm .movieWrap {
    margin-top: 40px
}
    
.kaitoriForm .customerTitle p,
.kaitoriForm .movieTitle p {
    font-size: 2rem;
    letter-spacing: 0.06em;
    padding: 4px 0 4px 10px;
    margin-bottom: 20px;
    border-left: 16px solid #000
}
    
.kaitoriForm .movieTxt p {
    font-size: 1.4rem;
    padding: 10px;
    margin-bottom: 20px;
    background: #c1c1c1;
}
    
.kaitoriForm .customerWrap .itemWrap:nth-child(2) { border-top: 1px dashed #000 }
.kaitoriForm .movieWrap .radioWrap:nth-child(3) { border-top: 1px dashed #000 }
.kaitoriForm .itemWrap,
.kaitoriForm .radioWrap {
    padding: 10px 0;
    border-bottom: 1px dashed #000
}
    
.kaitoriForm .itemWrap label,
.kaitoriForm .radioWrap .radioBox {
    font-size: 1.4rem;
    display: table
}
    
.kaitoriForm .itemWrap label p {
    width: 240px;
    font-size: 1.4rem;
    letter-spacing: 0.06em;
    vertical-align: middle;
    text-align: left;
    display: table-cell;
    position: relative
}
    
.kaitoriForm .radioWrap .radioBox p {
    width: 240px;
    font-size: 1.4rem;
    letter-spacing: 0.06em;
    line-height: 41px;
    vertical-align: middle;
    text-align: left;
    display: table-cell;
    position: relative
}
    
.kaitoriForm .itemWrap.textBox label p {
    width: 240px;
    font-size: 1.4rem;
    letter-spacing: 0.06em;
    vertical-align: top;
    text-align: left;
    padding-top: 10px;
    display: table-cell;
    position: relative
}

 .kaitoriForm .itemWrap label p .required {
    color: #e21412;
    font-size: 1.3rem;
    letter-spacing: 0.09em;
    font-style: normal;
    position: absolute;
    top: 10px;
    right: 20px
}
    
.kaitoriForm .itemWrap label p .required::after { content: "必須" }
.kaitoriForm .itemWrap input {
    width: 478px;
    height: 40px;
    font-size: 1.6rem;
    vertical-align: middle;
    padding: 0 10px;
    border: 2px solid #c1c1c1;
    transition: all 0.2s
}

.kaitoriForm .itemWrap.short input {
    width: 239px;
    margin-right: 10px
}

.kaitoriForm .itemWrap.model input {
    width: 239px;
    margin: 0 10px
}
    
.kaitoriForm .itemWrap input:hover,
.kaitoriForm .itemWrap input:active {
    border: 2px solid #1f1f1f
}
    
.kaitoriForm .radioWrap .radioItem {
    width: 478px;
    font-size: 1.4rem;
    vertical-align: middle;
    padding-top: 10px
}
 
.kaitoriForm .radioWrap .radioItem label + label { margin-left: 10px }
.kaitoriForm .radioWrap .radioItem input { margin-right: 4px }
.kaitoriForm .radioWrap .radioItem input:nth-child(1) { margin-left: 0 }
.kaitoriForm .itemWrap.model p.caution {
    color: #c00;
    font-size: 1.2rem;
    letter-spacing: 0.06em;
    margin-top: 10px;
    margin-left: 240px
}

.kaitoriForm .itemWrap.model p.caution span {
    margin-left: 1em;
    display: block
}
    
.kaitoriForm .itemWrap textarea {
    width: 478px;
    height: 120px;
    font-size: 1.6rem;
    vertical-align: top;
    padding: 10px;
    border: 2px solid #c1c1c1;
    transition: all 0.2s
}
    
.kaitoriForm .itemWrap textarea:hover,
.kaitoriForm .itemWrap textarea:active {
    border: 2px solid #1f1f1f
}
    
.kaitoriForm .policyCheck {
    width: 600px;
    font-size: 1.4rem;
    letter-spacing: 0.06em;
    text-align: center;
    padding: 10px;
    margin: 20px auto 0;
    border: 1px solid #000
}

.kaitoriForm .policyCheck p { margin-bottom: 10px }
.kaitoriForm .policyCheck p span { display: block }
.kaitoriForm .policyCheck p a {
    color: #f00;
    text-decoration: underline
}
    
.kaitoriForm .policyCheck input { margin-right: 6px }
.kaitoriForm .formBtn {
    width: 360px;
    margin: 20px auto 0
}
    
.kaitoriForm .formBtn input {
    width: 100%;
    color: #fff;
    font-size: 1.6rem;
    font-family: 'Noto Sans JP', sans-serif;
    letter-spacing: 0.06em;
    line-height: 40px;
    border: none;
    background: #000;
    border-radius: 0
}
    
.kaitoriForm .itemWrap em {
    color: #c00;
    font-size: 1.2rem;
    font-style: normal;
    letter-spacing: 0.09em;
    text-align: left;
    padding: 0 0 0 240px;
    margin-top: 6px;
    display: block
}
    
.kaitoriForm .policyCheck em {
    color: #c00;
    font-size: 1.2rem;
    font-style: normal;
    letter-spacing: 0.09em;
    text-align: center;
    display: block
}

@media (max-width: 768px) {
    .kaitoriForm {
        width: 92%;
        padding: 10px;
        margin: 20px auto 0
    }

    .kaitoriForm .title { margin-bottom: 10px }
    .kaitoriForm .title::before {
        width: 20px;
        height: 20px;
        left: 0
    }

    .kaitoriForm .title p {
        font-size: 1.8rem;
        padding-left: 20px;
    }
    
    .kaitoriForm .customerWrap,
    .kaitoriForm .movieWrap {
        margin-top: 20px
    }
    
    .kaitoriForm .customerTitle p,
    .kaitoriForm .movieTitle p {
        font-size: 1.6rem
    }
    
    .kaitoriForm .itemWrap label,
    .kaitoriForm .radioWrap .radioBox {
        display: block
    }
    
    .kaitoriForm .itemWrap label p {
        width: 100%;
        margin-bottom: 10px;
        display: block
    }
    
    .kaitoriForm .radioWrap .radioBox p {
        width: 100%;
        line-height: initial;
        margin-bottom: 10px;
        display: block
    }
    
    .kaitoriForm .itemWrap.textBox label p {
        width: 100%;
        display: block
    }

     .kaitoriForm .itemWrap label p .required {
        top: 0;
        right: 0
    }
    
    .kaitoriForm .itemWrap input { width: 100% }
    .kaitoriForm .itemWrap.short input { width: 50% }
    .kaitoriForm .itemWrap.model input { width: 50% }
    .kaitoriForm .radioWrap .radioItem {
        width: 100%;
        padding-top: 0
    }
 
    .kaitoriForm .radioWrap .radioItem label { display: block }
    .kaitoriForm .radioWrap .radioItem label + label {
        margin-top: 10px;
        margin-left: 0
    }
    
    .kaitoriForm .itemWrap.model p.caution {
        text-indent: -1em;
        padding-left: 1em;
        margin-left: 0
    }
    
    .kaitoriForm .itemWrap.model p.caution span {
        margin-left: 0;
        display: initial
    }
    
    .kaitoriForm .itemWrap textarea { width: 100% }
    .kaitoriForm .policyCheck { width: 100% }
    .kaitoriForm .formBtn { width: 100% }
    .kaitoriForm .formBtn input { line-height: 50px }
    .kaitoriForm .itemWrap em { padding: 0 }
}


/* ------ confirm ------ */

.kaitoriForm .confirmTxt {
    font-size: 1.4rem;
    letter-spacing: 0.06em;
    margin-top: 40px
}

.kaitoriForm .confirmBox { margin-top: 20px }
.kaitoriForm dl {
    font-size: 0;
    border: 1px solid #c1c1c1;
    border-top: none
}

.kaitoriForm dl:nth-child(1) { border-top: 1px solid #c1c1c1 }
.kaitoriForm dt {
    width: 238px;
    font-size: 1.4rem;
    vertical-align: middle;
    padding: 10px;
    border-right: 1px solid #c1c1c1;
    display: inline-block
}

.kaitoriForm dd {
    width: 478px;
    font-size: 1.4rem;
    padding: 10px;
    vertical-align: middle;
    display: inline-block
}

.kaitoriForm .btnWrap {
    width: 540px;
    font-size: 0;
    margin: 20px auto 0
}

.kaitoriForm .btnWrap form {
    width: 260px;
    vertical-align: middle;
    display: inline-block
}

.kaitoriForm .btnWrap form + form { margin-left: 20px }
.kaitoriForm .btnWrap form:nth-child(1) input {
    width: 260px;
    font-size: 1.6rem;
    font-family: 'Noto Sans JP', sans-serif;
    letter-spacing: 0.06em;
    line-height: 40px;
    border: none;
    background: #c1c1c1;
    border-radius: 0
}

.kaitoriForm .btnWrap form:nth-child(2) input {
    width: 260px;
    color: #fff;
    font-size: 1.6rem;
    font-family: 'Noto Sans JP', sans-serif;
    letter-spacing: 0.06em;
    line-height: 40px;
    border: none;
    background: #000;
    border-radius: 0
}

@media (max-width: 768px) {
    .kaitoriForm .confirmTxt { margin-top: 30px }
    .kaitoriForm dt {
        width: 100%;
        padding: 10px;
        border-right: none;
        background: #c1c1c1;
        display: block
    }

    .kaitoriForm dd {
        width: 100%;
        display: block
    }

    .kaitoriForm .btnWrap { width: 100% }
    .kaitoriForm .btnWrap form {
        width: 100%;
        display: block
    }

    .kaitoriForm .btnWrap form + form {
        margin-top: 10px;
        margin-left: 0
    }
    
    .kaitoriForm .btnWrap form:nth-child(1) input {
        width: 100%;
        color: #000
    }
    
    .kaitoriForm .btnWrap form:nth-child(2) input { width: 100% }
}


/* finish & error */

.kaitoriForm .errorTitle,
.kaitoriForm .finishTitle{
    font-size: 2.4rem;
    font-weight: 600;
    letter-spacing: 0.06rem;
    text-align: center;
    margin-bottom: 30px
}

.kaitoriForm .finishTitle span { display: block }
.kaitoriForm .errorTxt,
.kaitoriForm .finishTxt{
    font-size: 1.4rem;
    letter-spacing: 0.09em
}

.kaitoriForm .finishTxt + .finishTxt { margin-top: 10px }
.kaitoriForm .errorTxt a {
    color: #f00;
    text-decoration: underline
}

@media (max-width: 768px) {
    .kaitoriForm .errorTitle,
    .kaitoriForm .finishTitle{
        font-size: 1.8rem;
        margin-bottom: 20px
    }
}


/* PC・SP SWICH */

.spOnly { display: none !important }

@media screen and (max-width: 768px) {
	.pcOnly { display: none !important }
	.spOnly { display: block !important }
}