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

/****************************************************************************************************************************
                                                                              header
****************************************************************************************************************************/
#header {
    background-color: #fff;
}
/****************************************************************************************************************************
                                                                             トップ
****************************************************************************************************************************/
#top {
    position: relative;
    padding-top: 60px;
}
.top-img {
    background-image: url("../images/about/aboutus-top-sp.jpg");
}
.top-imgbox img {
    width: 100%;
    height: 100%;
    position: relative;
}
h1 img {
    position: absolute;
    width: 30vw;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.top-inner-sentence h2 {
  position: absolute;
  top: 65%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: #fff;
  font-size: 4vw;
  font-weight: bold;
  margin-top: 10px;
}
/****************************************************************************************************************************
                                                      section01 
****************************************************************************************************************************/
#section01 {
    text-align: center;
    font-family: "游明朝", YuMincho, "Hiragino Mincho ProN W3", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
    padding: 0 15px;
}
#section01 h3 {

}
#section01 p {
    margin-top: 30px;
}
#section01 p span {
  color: #3C0162;
}
/****************************************************************************************************************************
                                                      section02 
****************************************************************************************************************************/
#contents {
    padding: 0 15px;
}
#section02 {
	padding: 30px 0;
}
.Form-Item {
    position: relative;
    padding: 20px 0;
	width: 100%;
    border-top: 1px solid #9e9e9e;
}
.Form-Item-block {
    display: flex;
    flex-flow: column;
    justify-content: space-between;
    width: 100%;
    margin: 0 auto;
    align-items: flex-start;
}
.Form-Item-Label {
    margin: 0 0 10px;
    font-size: 16px;
    line-height: 1;
}
.sub_areaText {
    margin: 0 5px;
}
.radio-box {
    display: flex;
    flex-flow: row nowrap;
    margin-left: 0;
    width: 100%;
    justify-content: flex-start;
    margin-top: 20px;
}
.choice {
    margin: 0;
}
input {
    position: relative;
}
.mw_wp_form .error {
    font-size: 12px !important;
    color: #B70000;
    display: block;
    position: relative;
    top: 0;
    left: 0;
    margin: 0 0 10px;
}
.Form-Item-Input01 {
    width: 100%;
    border-radius: 5px;
    height: 40px;
    border: 1px solid #777;
    font-size: 16px;
    padding: 10px;
}
.error-box {
    position: relative;
    display: flex;
    flex-flow: column;
    width: 100%;
}
.error-box-auto {
    position: relative;
    display: flex;
    flex-flow: column;
    width: auto;
}
.Form-Item-box {
    display: flex;
    justify-content: flex-start;
	align-items: center;
    width: 100%;
    position: relative;
}
#yubin {
    flex-flow: column;
    align-items: flex-start;
}
.Form-Item-Input02 {
	margin-right: 5%;
	width: 90%;
	border-radius: 5px;
    height: 40px;
    border: 1px solid #777;
    font-size: 16px;
    padding: 10px;
}
.Form-Item-Input03 {
	width: 90%;
	border-radius: 5px;
    height: 40px;
    border: 1px solid #777;
    font-size: 16px;
    padding: 10px;
}
.mwform-zip-field {
    font-size: 16px;
}
.postnumber.p-postal-code {
    border-radius: 5px;
    height: 40px;
    border: 1px solid #777;
    font-size: 16px;
    padding: 10px;
}
.yubin {
    font-size: 13px;
    margin: 20px 0 0 0;
}
#telephone-flex {
    display: flex;
    flex-flow: column;
    align-items: flex-start;
    justify-content: flex-start;
    width: 100%;
}
.mwform-tel-field {
    width: auto;
    display: flex;
    flex-flow: row nowrap;
    align-items: center;
    justify-content: flex-start;
    font-size: 16px;
}
.mwform-tel-field .telephone {
	width: 80px!important;
	border-radius: 5px;
    height: 40px;
    border: 1px solid #777;
    font-size: 16px;
    padding: 10px;
    margin-right: 10px;
}
.mwform-tel-field .telephone:nth-child(2){
	margin: 0 10px;
}
.mwform-tel-field .telephone:nth-child(3){
	margin-left: 10px;
}
.mwform-tel-field .telephone:nth-child(2),.mwform-tel-field .telephone:nth-child(3) {
	width: 120px!important;
	border-radius: 5px;
    height: 40px;
    border: 1px solid #777;
    font-size: 16px;
    padding: 10px;
}
#address-box {
    font-size: 16px;
    width: 100%;
}
#pref {
    height: 40px;
    font-size: 16px;
    padding: 5px 10px;
    width: 180px;
}
.selectbox {
    margin-bottom: 10px;
}
.juusho {
    width: 100%;
    margin-bottom: 10px;
}
#city,#area,#addr {
    width: 100%;
    border-radius: 5px;
    height: 40px;
    border: 1px solid #777;
    font-size: 16px;
    padding: 10px;
}
.mandatory {
    font-size: 70%;
    margin-left: 10px;
    vertical-align: top;
    color: #bd0303;
}
.form-line {
    margin-bottom: 15px;
    display: flex;
    flex-flow: column;
    width: 100%;
    justify-content: flex-start;
}
.form-line.juusho {
    font-size: 13px;
}
.Form-Item-Textarea {
    width: 100%;
    height: 300px;
    border-radius: 5px;
    border: 1px solid #777;
}
input[type="submit"] {
    -webkit-appearance: none;
    border-radius: 14px;
}
.sub_areabutton {
    display: flex;
    align-items: center;
}
.check-text p {
    font-size: 13px;
    border-top: 1px solid #9e9e9e;
    padding: 20px 0;
}
label {
    font-size: 16px;
    display: flex;
    flex-flow: row nowrap;
    align-items: center;
    width: auto;
    margin: 0;
    justify-content: center;
}
label#doui {
    margin: 30px auto;
}
#joukyou {
    font-size: 16px;
    padding: 5px 10px;
    width: 120px;
}
.file-box{
    position: relative;
    display: flex;
    flex-flow: row nowrap;
    width: 100%;
}
#file {
    position: relative;
    font-size: 16px;
}
.mwform-file-delete {
    cursor: pointer;
    visibility: hidden;
    font-size: 16px;
    margin-left: 20px;
    color: #f00;
}
.check-text {
    text-align: center;
    padding-top: 0px;
}
.check-text p span {
    color: #8B3C94 ;
}
.checkbox {
	margin: 0 5px 0 0;
}
input[type="checkbox"] {
    width: 20px;
    height: 20px;
}
.button {
    transition: background-color 2s;
    display: block;
    transform-origin: 0 0 0;
    background: linear-gradient(90deg, rgba(139, 60, 148, .9), rgba(60, 1, 98, .9));
    overflow: hidden;
    position: relative;
    filter: drop-shadow(0px 0px 5px rgba(0,0,0,0.6));
    cursor: pointer;
    color: #fff;
    margin: 0 auto;
    width: 240px;
    text-decoration: none;
    border: none;
    padding: 14px 0;
    font-size: 15px;
    font-weight: bold;
    height: 65px;
}
/****************************************************************************************************************************
                                                        footer
****************************************************************************************************************************/
.footer-logoarea {
    padding: 200px 0;
}
.footer-qsfix-logo {
    left: 50%;
    transform: translate(-50%, 0%);
}
/**************************************************** min-width: 600px *********************************************************/
@media only screen and (min-width: 600px) {
/****************************************************************************************************************************
                                                        トップ
****************************************************************************************************************************/
h1 img {
  width: 70px;
}
.top-inner-sentence h2 {
  top: 65%;
  font-size: 21px;
}
/****************************************************************************************************************************
                                                      section01 
****************************************************************************************************************************/
#section01 {
    width: 100%;
    padding: 0;
    max-width: 600px;
}
#section01 h3 {
    font-size: 20px;
}
#section01 p {
    font-size: 16px;
}
/****************************************************************************************************************************
                                                      section02 
****************************************************************************************************************************/
#contents {
    padding: 0 30px;
}
#section02 {
	width: 100%;
    max-width: 600px;
}
.Form-Item:nth-child(1)::before {
	width: 600px;
}
.Form-Item::after {
	width: 600px;
}
.Form-Item-box {
    justify-content: flex-start;
}
.Form-Item-Label {
    font-size: 16px;
}
.sub_areabutton {
    font-size: 21px;
}
#telephone-flex {
    display: flex;
    flex-flow: row nowrap;
    align-items: center;
    justify-content: flex-start;
}
.radio-box {
    display: flex;
    flex-flow: row nowrap;
    margin-left: 20px;
    width: 100%;
    justify-content: flex-start;
    margin-top: 0px;
}
.radio-box {
    margin-left: 20px;
    width: 180px;
}
.check-text p {
    font-size: 16px;
}
label {
    font-size: 16px;
}
input[type="checkbox"] {
    width: 30px;
    height: 30px;
}
.button {
    width: 300px;
}
}
/**************************************************** min-width: 1024px *********************************************************/
@media only screen and (min-width: 1024px) {
/****************************************************************************************************************************
                                                         トップ
****************************************************************************************************************************/
#top {
 padding-top: 105px;
}
.top-img {
    height: 200px;
    background-image: url("../images/contact/contact-top.jpg");
}
h1 img {
    width: 200px;
}
/****************************************************************************************************************************
                                                        section01 
****************************************************************************************************************************/
#section01 {
    width: 100%;
    max-width: 960px;
}
#section01 h3 {
    font-size: 24px;
}
#section01 p {
    font-size: 18px;
    margin-top: 70px;
}
/****************************************************************************************************************************
                                                        section02 
****************************************************************************************************************************/
#section02 {
	width: 100%;
    max-width: 960px;
	padding: 60px 0;
}
.Form-Item-block {
    flex-flow: row nowrap;
    align-items: center;
}
.Form-Item-box {
    width: 600px;
}
.Form-Item-Label {
    font-size: 18px;
    margin: 0;
}
#yubin {
    flex-flow: row nowrap;
    align-items: center;
}
.yubin {
    font-size: 13px;
    margin: 0px 0 0 20px;
}
.Form-Item-Input01 {
    width: 100%;
	height: 40px;
}
.Form-Item-Input02 {
	margin-right: 20px;
	width: 200px;
	height: 40px;
}
.Form-Item-Input03 {
	width: 200px;
	height: 40px;
}
.mwform-tel-field .telephone {
    width: 60px!important;
    height: 40px;
    font-size: 16px;
    padding: 10px;
}
.mwform-tel-field .telephone:nth-child(2) ,.mwform-tel-field .telephone:nth-child(3){
	width: 100px!important;
	height: 40px;
    font-size: 16px;
    padding: 10px;
}
.Form-Item-Textarea {
    width: 600px;
    height: 300px;
}
.Form-Item:nth-child(1)::before {
  width: 960px;
}
.Form-Item::after {
  width: 960px;
}
}