
/*SP → タブレット　→ PC*/
/* iPhone 縦 */

/*============ #recTitle ===============*/

#recTitle{ background-color:#CC7DB1; }

/*============ #aboutMessage ===============*/
.Breadcrumb{ background-color:#F5E5EF;  }

#entryArea{ padding: 100px 7vw; margin: 0 auto; background-color: #F5E5EF; }
#entryArea h2{ width: auto; /*height: 35px; */padding-bottom: 20px; }
#entryArea h2 img{ width: 100%; height: auto; }
#entryArea .note{ font-size: 0.85em;}

.entryArea_wrap{
    background-color: #FFF;
    padding: 90px 7vw;
    box-sizing: border-box;
}


#form_Wrap .contact{ border-bottom: 2px solid #231815; }
#form_Wrap .contact .memo{ font-size: 1em; }
#form_Wrap .note{ font-size: 0.9em; padding: 30px 0px; }
#form_Wrap .note2{ font-weight: bold; padding-bottom: 10px; }



#form_thanksWrap{text-align: center; }
#form_thanksWrap .tit_thanks{ padding: 0 0 40px 0; }
#form_thanksWrap .tit_thanks img{ width: 100%; }
#form_thanksWrap .message_thanks{
    font-size: 0.9em;
    font-weight: bold;
    line-height: 2em;
    padding: 0 0 40px 0;
 }
#form_thanksWrap .btn_thanks{
    position: relative;
    padding: 20px;
    background-color: #CC7DB1;
    color: #FFF;
    font-weight: bold;
    width: 80%;
    margin: 0 auto;
 }
#form_thanksWrap .btn_thanks:hover{
    filter:alpha(opacity=70);/* IE 6,7*/
    -ms-filter: "alpha(opacity=70)";/* IE 8,9 */
    -moz-opacity:0.7;/* FF , Netscape */
    -khtml-opacity: 0.7;/* Safari 1.x */
    opacity:0.7;
 }
#form_thanksWrap .btn_thanks a{
    position: absolute;
    top: 0%;
    left: 0%;
    width: 100%;
    height: 100%;
    vertical-align: middle;
 }

.form_list{ border-top: 1px solid #CCCCCC; }

.form_list.last{ border-bottom: 1px solid #CCCCCC; }
.form_list .label{
    font-weight: bold;
    padding: 10px 0;
    padding: 20px 0px;
}

.form_list .form_input{
    padding: 0px 0px 20px 0px;
    word-break: break-all;
}

.form_input select#workstatus{
    width: 100%;
    padding: 10px 15px;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-image:
    linear-gradient(45deg, transparent 50%, gray 50%),
    linear-gradient(135deg, gray 50%, transparent 50%),
    linear-gradient(to right, #ccc, #ccc);
    background-position:
        calc(100% - 20px) calc(1em + 2px),
        calc(100% - 15px) calc(1em + 2px),
        calc(100% - 2.5em) 0.5em;
    background-size:
    5px 5px,
    5px 5px,
    1px 1.5em;
  background-repeat: no-repeat;
}













/* form調整*/
.form_input input[type=text],
.form_input input[type=tel],
.form_input input[type=mail]  {
    width: 100%;
    border: 1px solid #CCCCCC;
    box-sizing: border-box;
    padding: 10px 15px;
}
.form_input input[name=address],
.form_input textarea{
    width: 100%;
    border: 1px solid #CCCCCC;
    box-sizing: border-box;
    padding: 10px 15px;
}
.form_input input#mail  {
    margin: 0 0 20px 0;
}
.form_input input[type=radio] { width: 30px; }
.form_input input[type="checkbox"] { padding: 0 30px 0 0; }
.form_input input[id=age] { width: 50%; }

.form_input label.radio_list { display: block; padding: 0 0 10px 0; }
.agree { padding: 30px 0 0; }

.select_btns{ text-align: center; padding: 70px 0 0 0;}
.select_btns .delete,
.select_btns .submit{
    padding: 20px 10px;
    width: 100%;
    display: inline-block;
    font-weight: bold;
    border: 0;
}
.select_btns .delete:hover,
.select_btns .submit:hover{
    filter:alpha(opacity=70);/* IE 6,7*/
    -ms-filter: "alpha(opacity=70)";/* IE 8,9 */
    -moz-opacity:0.7;/* FF , Netscape */
    -khtml-opacity: 0.7;/* Safari 1.x */
    opacity:0.7;
}

.select_btns .delete{
    color: #000;
    background-color: #F5E5EF;
    margin: 0 0 30px 0;
}
.select_btns .submit{ color: #FFF; background-color: #CC7DB1; }

.my-parts {
  display: inline-block;
  width: 50px;
  height: auto;
  position: relative;
  border: 1px solid rgba(0,0,0,.1);
  cursor: pointer;
}
.my-parts span.reset_mark{
    width: 25px;
    height: 25px;
    position: absolute;
    left: 30px;
}
.my-parts span.reset_mark::before,
.my-parts span.reset_mark::after {
    display: block;
    content: "";
    position: absolute;
    width: 3px;
    height: 100%;
    background: #000;
}
.my-parts span::before { transform: rotate(-45deg); }
.my-parts span::after { transform: rotate(45deg); }

/*確認画面*/
#form_Wrap .note.form_confirm{
    padding: 70px 0;
    text-align: center;
    font-size: 1.0em;
}

.form_confirm .form_list .label{ padding: 20px 0px 20px 15px; background-color: #E9E8E8; }
.form_confirm .form_list .form_input{ padding: 20px 0px 20px 15px; word-break: break-all; }

@media screen and (max-width:350px) {
/*　for iPhone Landscape　(iPhone4)　*/


}



@media screen and (min-width:480px) {
/*　for iPhone Landscape　(iPhone 横)　*/


/*#header .headLogo{ padding-right: 30vw; }
*/


}
@media screen and (min-width:600px){
/***************************
　for iphone 6 横
****************************/
#formArea { background-size: 400px; background-position-x: 130%; }
#form_thanksWrap .btn_thanks{ width: 200px; }
/*#form_thanksWrap{ padding: 100px 60px; }*/

}

@media screen and (min-width:768px){

/***************************
　for iPad 　
****************************/


#recTitle{ padding: 50px 50px 50px 50px; }


#entryArea h2{ height: 35px;  }
#entryArea h2 img{ width: auto; height: 100%; }


#formArea{ padding: 15vw 0; }
#formArea .lead{ padding: 7vw 0vw; }
#formArea .parts{ width: 25vw; }

/*#form_Wrap{ padding: 60px; }*/
#form_thanksWrap .tit_thanks img{ width: 90%; }

#formArea{
    padding:70px 7vw;
    background-size: 45%;
    background-position-x: 500px;
    background-position-y: 60px;
}
#formArea .text{ padding: 0 0 100px 0; }

#formArea .contact .memo{
    font-size: 1.2em;
    padding: 30px 0px 30px 30px;
}

.form_input select#workstatus{ width: 60%; }

/*form_Inner*/
.select_btns .delete,
.select_btns .submit{ width: 45%; }
.select_btns .delete{ margin: 0 15px 30px 0; }



}
@media screen and (min-width:1024px) {
/***************************
　for PC 　
****************************/
.w_max{ max-width: 1300px; margin: 0 auto;}

#formArea{
    padding: 7vw;
    max-width: 1240px;
    margin: 0 auto;
}

#formArea .contact{
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    padding: 0 0 30px 0;
}
#formArea .contact .btn{ width: 50%; flex-grow: 1; }
#formArea .contact .memo{
    width: 50%;
    padding: 15px 0px 40px 40px;
    flex-grow: 1;
}
#form_Wrap .contact .memo{ padding: 0 0 30px 30px; }
#form_thanksWrap .tit_thanks img{ width: auto; }

#formArea .contact.mail{ padding: 0 0 70px 0; }

.form_list{
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
}
.form_confirm .form_list .label,
.form_list .label{
    width: 25%;
    flex-grow: 1;
    padding: 20px 0px 20px 0px;
}
.form_confirm .form_list .label{
    padding: 20px 0px 20px 20px;
    text-indent: 0em;
}

.form_confirm .form_list .form_input,
.form_list .form_input{
    width: 75%;
    padding: 20px 0px 20px 40px;
    flex-grow: 3;
}
.form_input input[type=text],
.form_input input[type=tel],
.form_input input[type=mail]  {
    width: 60%;
}
.form_input input[name=address],
.form_input textarea{
    width: 90%;
}
.form_input input[id=age] { width: 30%; }
.form_input label.radio_list {
    padding: 0 50px 0 0;
    display: inline-block;
}

.select_btns .delete,
.select_btns .submit{
    width: 35%;
}
.select_btns .delete{
    margin: 0px 20px 30px 0;
}

}
@media screen and (min-width:1400px) {
/***************************
　for PC 2
****************************/



#formArea{ padding: 70px 16vw 70px; background-position-x: 80%; }
#formArea .parts{ width: 13vw; }
#formArea .part_img{ width: 90%; }

}

