@charset "utf-8";
/* CSS Document */
html{
	overflow:auto;
}
body {
	overflow: hidden;
	min-width: 320px;
  background: #000 url("/sp/img/recruit_02.jpg") no-repeat scroll left 110px;
  background-size:100% auto;
}

/*
.inview, .inviewfadeIn, .inviewfadeInUp, .inviewfadeInDown, .inviewfadeInRight, .inviewfadeInLeft, .inviewbounceIn {
    opacity: 0;
}
.fadeIn, .fadeInUp, .fadeInDown, .fadeInRight, .fadeInLeft, .bounceIn {
    opacity: 1;
}*/

.container{width:100%;max-width: 480px;}

#main {
    padding: 0;
}
#main h2 {
    margin: 4%;
    text-align: center;
}
#main h2 img {
    width: 100%;
}
#main .box {
}
#main h3 {
    padding: 50px 0 30px;
    text-align: center;
}
#main h3 img{
    max-width: 320px;
}



.dd{text-align: left;font-size:0.75rem;}

.bg img{width:100%;}

#catch .bg {
    width: 100%;
    position: relative;

}
#catch .bg .pleft{
    margin: 37% 2% 10%;
		/*margin: 10% 2% 10%;*/
}

@media screen and (min-width: 480px) {
	#catch .bg .pleft{
	    margin: 70% 2% 10%;
	}
}

#catch{
}
#catch .photo{
}
#catch .photo img{
	width:100%;
}




#catch02 {
  margin:0px auto 50px;
}
#catch02 .bg{
  background: rgba(0, 0, 0, 0) url("/img/recruit_07.png") no-repeat scroll center center;
  width: 100%;
  /*height: 1280px;
  position: relative;*/
  z-index: 2;
}
#catch02 .pright{
    /*position: absolute;
    top:-160px;
    right:0;*/
    width: 80%;
    margin:3% 0 3% 20%;
		text-align:right;
	}

#catch02 .pright img{max-width: 480px;}

#catch02 .pleft_msg{
    max-width: 480px;
    /*position: absolute;
    top:100px;*/
    width: 94%;
    margin:2% 3%;
    font-size: 0.9rem;
    z-index: 2;
    text-align:left;
    background: rgba(1,1,1,0.5);
		padding:1%;
}



#catch02 .pright2{
    /*position: absolute;
    top:280px;
    right:10%;*/
    width: 70%;
    margin:-5% 0 3% 30%;
		text-align: right;

}
#catch02 .pright2 img{max-width: 480px;}


#catch02 .pleft2{
    max-width: 480px;
    /*position: absolute;
    top: 450px;
    left:0;*/
    width: 80%;
		margin-top: -15%;

}
#catch02 .pleft2_msg{
    max-width: 600px;
    /*position: absolute;
    top:870px;
    right:15%;
    */
    width: 94%;
    margin:2% 3%;
    z-index: 3;
    background: rgba(1,1,1,0.5);
    padding:1%;
    text-align:left;
}
#catch02 .pleft3{
    max-width: 780px;
    /*position: absolute;
    top: 900px;
    left:0;
    */
    margin:3% 0 3%;
    width: 60%;
    z-index: 2;
}

#catch03 {
}
#catch03 .bg{
  z-index: 1;
  background: rgba(0, 0, 0, 0) url("/img/recruit_08.jpg") repeat-x center top;
  width: 100%;
  /*position: relative;*/
}

#catch03 .pcenter{
   margin:60px auto 30px;
   width:90%;
   max-width:400px;
}
#catch03 .msg{
   margin:30px auto 50px;
   width:90%;
	 text-align:left;
	 font-size:0.9rem;
}
#catch03 .msg .catchm{
   	 font-size:1.1rem;
}
#catch03 .prms01,
#catch03 .prms02,
#catch03 .prms03
{
  width:92%;
	max-width: 480px;
  margin:3% auto;
  position: relative;
  display:block;
  padding:25px 0;
}

#catch03 .prms01{
  background: rgba(0, 0, 0, 0) url("/img/recruit_10.png") no-repeat center top /cover;
}

#catch03 .prms02{
  background: rgba(0, 0, 0, 0) url("/img/recruit_11.png") no-repeat center top /cover;
}
#catch03 .prms03{
  background: rgba(0, 0, 0, 0) url("/img/recruit_12.png") no-repeat center top /cover;
}
#catch03 .prmsno{
  font-family: 'Century Gothic';
  letter-spacing: 0.3em;
  font-size:0.7rem;
}
#catch03 .prmsno span{
  display: block;
  letter-spacing: 0.1em;
  background: url(/img/number_bg.png)no-repeat bottom center / contain;
  color: #303030;
  /* padding: 0 20px 10px; */
  /* width:20px; */
  text-align: center;
  font-size: 1.66rem;
  letter-spacing: 0.1em;
  font-family: 'Dancing Script', cursive;
  line-height: 1;
}
#catch03 .prms01 div,#catch03 .prms02 div,#catch03 .prms03 div {
  /*position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translateY(-50%) translateX(-50%);
transform: translateY(-50%) translateX(-50%);*/
      vertical-align: middle;
      text-align: center;
      width:92%;
      margin:10px auto 0;
  }


#catch03 div .prmsttl{
  font-size:1.4rem;
	margin-bottom:8px;
	line-height: 1.3;
color: #352f24;
    font-weight: 600;
}
#catch03 div .prmsmsg{
  font-size:0.9rem;
  text-align:left;
}










#about {
    padding: 4% 0;
}


#about dl {
    border-bottom: 1px solid #999;
    margin: 0 auto;
    overflow: hidden;
    padding: 2%;
    text-align: left;
    width:90%;
		max-width:480px;
    font-size: 0.9rem;
}
#about dl:last-of-type {
    border: medium none;
}
#about dt {
    float: left;
    padding: 3px 0 0;
    width: 25%;
}
#about dd {
    float: left;
    padding: 3px 0 0;
    width: 75%;
}
#about dd ul {
    margin-bottom:10px;
		}
		#about dd ul:last-child {
		    margin-bottom:0px;
				}
#about dd ul li{
    margin-left: 15px;
		width:auto;
		display: block;
}


#staff_blog{
	margin: 8% 0;
}

#staff_blog iframe{
	margin: 4% 0 0;
}





#contact {
    padding: 0 0 50px;
    text-align: center;
		background:url("/sp/img/recruit_15.jpg") no-repeat center top;
		background-size:100% auto;
}

#contact .container {width:94%;margin: auto;		max-width: 480px;}

#contact .tel {
    /*color: #660000;*/
    font-size: 2rem;
    margin: 0 0 4%;
    text-align: center;
    text-decoration: none;
}
#contact .tel a {
    /*color: #C60103;*/
}
.line_01{
	margin-top:6%;
}
.line_01 img{
	width:64%;
}
.email.btn_more{
  width:inherit;
  font-size: 1rem;
  max-width:320px;
}
.email.btn_more a{
  font-size: 1rem;
}

.btn.line_02 {
    background-color: #00c200;
    display: inline-block;
    padding: 0;
    margin-top: 2%;
	margin-bottom:6%;
	width: inherit;
  max-width:320px;
}
.line_02 a {
    color: #fff;
    display: block;
    font-size: 1rem;
    padding: 6% 0;
    text-decoration: none;
}
#contact dl {
    border-bottom: 1px solid #999999;
    margin: 0 auto;
    overflow: hidden;
    padding: 3% 2% 6%;
    text-align: left;
}
#contact dl:last-of-type {
    border: medium none;
}
#contact dt {
    font-size: 0.88rem;
    margin: 0 0 2%;
}
#contact dt .sm {
		font-size: 0.66rem;
		background: #d90000 none repeat scroll 0 0;
				color: #fff;
				margin-left: 10px;
				padding: 2px 3px;
}
#contact dd p{
	margin-top: 10px;
}
#contact .btn.form-submit{
	/*background-color:#660000;*/
}
.text {
    border: 1px solid #ccc;
    padding: 2%;
    width: 96%;
}
.select {
    background-color: #fff;
    border: 1px solid #ccc;
    margin: 0 5px 5px 0;
    padding: 2%;
    width: 30px;
}
.textarea {
    border: 1px solid #ccc;
    height: 120px;
    padding: 2%;
    width: 96%;
}

.formbutton {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    border: 0 none;
    cursor: pointer;
    font-size: 0;
    line-height: 0;
    margin: 20px 0;
    overflow: visible;
    padding: 0;
    width: auto;
}

.btn_more {
    width: auto;
}









#mens {
    background: rgba(0, 0, 0, 0) url("/sp/img/mens_01.jpg") no-repeat scroll right top / cover ;
    color: #fff;
    padding: 2% 0;
    text-align: center;
}
#mens h3 {
    max-width:480px;
		width:90%;
		margin:2% auto 5%;
}
#mens h3 img{
		width:100%;
		max-width:480px;
}

#mens h4 {
    max-width:480px;
		width:90%;
		margin:2% auto;
		font-size:0.9rem;
		text-align: left;
}


#mens2 {
    background: rgba(0, 0, 0, 0) url("/img/mens_04.jpg") no-repeat scroll center top / 100% auto ;
    color: #fff;
    padding: 5% 0 2.5%;
    text-align: center;
}

#mens2 h3 {
    max-width:480px;
		width:90%;
		margin:2% auto 5%;
}
#mens2 h3 img{
		width:100%;
}

#mens2 h4 {
    max-width:480px;
		width:90%;
		margin:2% auto;
		font-size:0.9rem;
		text-align: left;
}
#mens2 h4 span{
    color:#D3B986;
		font-size:1.1rem;
}

#mens .tel {
    color: #b1e3fe;
    font-size: 2rem;
    margin: 0 0 2%;
    text-align: center;
    text-decoration: none;
}
#mens .tel a {
    /*color: #b1e3fe;*/
}
#mens dl {
    border-bottom: 1px solid #555;
    margin: 0 auto;
    overflow: hidden;
    padding: 3% 2% 6%;
    text-align: left;
}
#mens dl:last-of-type {
    border: medium none;
}
#mens dt {
    font-size: 0.88rem;
    margin: 0 0 2%;
}
#mens dt .sm {
    font-size: 0.66rem;
}
#mens dd {
}
.error {
    border: 1px solid #ff4a58;
    color: #ff4a58;
    font-size: 1rem;
    font-weight: bold;
    line-height: 1.4;
    margin: 4% auto;
    padding: 4% 2%;
    text-align: center;
}





#completion {
    padding: 0 0 4%;
    text-align: center;
}
#completion .pp {
    color: #C60103;
    font-family: "EB Garamond",sans-serif;
    font-size: 3rem;
    font-weight: bold;
    margin: 10% auto 4%;
    text-align: center;
}
#completion .ppd {
    font-size: 0.88rem;
    padding: 4%;
    text-align: center;
}

#bn_blog{
padding:2%;
margin: 20% 0 0;
}
#bn_blog img{
width:100%;
}




@media screen and (min-width: 480px) {
	#contact {
			background-size:cover;
	}

}
