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

.heading-img img{
    margin-left: 24px;
}


.inquiry_inner{
    max-width: 720px;
    width: 100%;
    margin: 0 auto;
}

.inquiry_item{
    margin-top: 24px;
}
.inquiry_item:first-child{
    margin-top: 0px;
}
.inquiry_title{
    display: flex;
    align-items: center;
    margin-bottom: 8px;
}
.inquiry_title_text{
    color: #333;
    margin-right: 24px;
    font-weight: bold;
}

.required{
    background:#ff3232;
    color: #FFF;
    border-radius: 4px;
    font-size: 14px;;
    padding: 0.25em 0;
    width: 40px;
    height: 24px;
    text-align: center;
	}
.any{
    background:#acacac;
    color: #FFF;
    border-radius: 4px;
    font-size: 14px;;
    padding: 0.25em 0;
    width: 40px;
    height: 24px;
    text-align: center;
	}

.input_textbox{
    font-size:16px;
    border: 2px solid #CCC;  /* 枠線 */
    border-radius: 4px;   /* 角丸 */
    padding:0.5em 16px;          /* 内側の余白量 */
    width: 100%;             /* 横幅 */
    max-width: 720px;
    height: 48px;           /* 高さ */
    font-size: 1em;          /* 文字サイズ */
    line-height: 1.2;        /* 行の高さ */
	background-color:#FFF;	
    
}

.input_pulldown{
    font-size:16px;
    border: 2px solid #CCC;  /* 枠線 */
    border-radius: 4px;  /* 角丸 */
    padding:0.5em 16px;          /* 内側の余白量 */
    width: 50%;             /* 横幅 */
    margin: 0 auto;
    max-width: 720px;
    height: 48px;           /* 高さ */
    font-size: 1em;          /* 文字サイズ */
    line-height: 1.2;        /* 行の高さ */
	background-color:#FFF;	
}



.input_pulldown_arrow{
  position: relative;
}
.input_pulldown{
  -webkit-appearance: none;
  appearance: none; /* デフォルトの矢印を非表示 */
}
.input_pulldown::-ms-expand {
  display: none; /* デフォルトの矢印を非表示(IE用) */
}
/* セレクトボックスの矢印デザイン変更 */
.input_pulldown{
    background-image: url(../image/arrow.svg);
    background-position: right 16px center;
    background-repeat: no-repeat;
    background-size: 16px 16px;
}



.input_calendar{
  font-size:16px;
    border: 2px solid #CCC;  /* 枠線 */
    border-radius: 4px;  /* 角丸 */
    padding:0.5em 16px;          /* 内側の余白量 */
    width: 50%;             /* 横幅 */
    margin: 0 auto;
    max-width: 720px;
    height: 48px;           /* 高さ */
    font-size: 1em;          /* 文字サイズ */
    line-height: 1.2;        /* 行の高さ */
	background-color:#FFF;	
}

input[type="date"] {
    font-size:16px;
    border: 2px solid #CCC;  /* 枠線 */
    border-radius: 4px;  /* 角丸 */
    padding:0.5em 16px;          /* 内側の余白量 */
    width: 50%;             /* 横幅 */
    margin: 0 auto;
    max-width: 720px;
    height: 48px;           /* 高さ */
    font-size: 1em;          /* 文字サイズ */
    line-height: 1.2;        /* 行の高さ */
    background-color:#FFF;	
    position: relative;
}

input[type="date"]::-webkit-calendar-picker-indicator {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: auto;
  height: auto;
  background: transparent;
  z-index: 1;
}

input[type="date"]::after {
  content: '';
  background-image: url(../image/calendar.svg);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: 0 0;
  width: 18px;
  height: 18px;
  position: absolute;
  top: 50%;
  right: 16px;
  transform: translateY(-50%);
}



.caption{
    margin-top: 8px;
    font-size: 14px;
    color: #acacac;
}

.free_textbox{
    font-size:16px;
	color:#333;
    border: 2px solid #CCC;  /* 枠線 */
    border-radius: 4px;   /* 角丸 */
    padding: 0.5em;          /* 内側の余白量 */
    width: 100%;             /* 横幅 */
    margin: 0 auto;
    max-width: 720px;
    height: 140px;           /* 高さ */
    font-size: 1em;          /* 文字サイズ */
    line-height: 1.2;        /* 行の高さ */	
}

#confirmation_button{
    display: block;
    align-items: center;
    font-weight: bold;
    text-align: center;
    width: 240px;
    height: 64px;
    background-color: #e89499;
    color: #fff;
    border-radius: 32px;
    line-height: 40px;
    font-size: 14px;
    margin-top: 32px;
}
.inquiry_inner #confirmation_button{
    line-height: 32px;
    padding: 16px;
}
.return{
    display: block;
    align-items: center;
    font-weight: bold;
    text-align: center;
    width: 240px;
    height: 64px;
    background-color: #acacac;
    color: #fff;
    border-radius: 32px;
    line-height: 40px;
    font-size: 14px;
    margin-top: 32px;
    margin-right: 96px;
}
.return a{
    display: block;
}

.check_send{
    display: flex;
    flex-direction: row-reverse;
    justify-content:center;
}

.input_pulldown{
   border:  2px solid #CCC; /* 枠線 */
   font-size: 16px;           /* 文字サイズ */
   padding:0.5em 16px;           /* 内側の余白量 */
   border-radius: 4px;        /* 角丸(半径) */
}
select .first{
    color: #acacac;
    background: #f7f7f7;
}
.select {
    color: #acacac;
    background: #f7f7f7;
}
.select{
    background-image: url(../image/arrow.svg);
    background-position: right 16px center;
    background-repeat: no-repeat;
    background-size: 16px 16px;
}
select option {
    color: #333;
    
}
optgroup{
    color: #333;
}


:placeholder-shown{/*未入力*/
    color: #acacac;
    background:#f7f7f7;
}
.input_calendar:invalid{
    color: #acacac;
    background: #f7f7f7;
}


.note li{
    margin-left: 1.4em;
    text-indent: -1.4em;
    margin-bottom: 8px;
}
.note_title{
    font-size: 16px;
    font-weight: bold;
    margin-top: 32px;
    margin-bottom: 16px;
}
.note_conteiner{
    margin: 64px auto 96px auto;
}

.answer{
    line-height: 1.5em;
    padding: 16px;
    width: 100%;
    background: #FFF0F5;
    box-sizing: border-box;
    border-radius: 8px;
}
.check_conteiner{
    margin-top: 176px;
    margin-bottom: 96px;
}
.compleat_conteiner #page-footer{
    position: absolute;
    bottom: 0;
    left: 0;
}
.check_note{
    line-height: 1.5em;
    padding: 16px;
    border: 2px solid #e89499;
    box-sizing: border-box;
    border-radius: 8px;
    margin:16px 0;
    text-align: center;
}
.check_note h2{
    font-size: 18px;
    font-weight: bold;
    text-align: center;
    margin-bottom: 8px;
    color: #e89499;
}
.heading-img img{
    margin-bottom: 0px;
}

    .return:hover,#confirmation_button:hover{
        transition: 0.5s;
        opacity: 0.5;
    }
    .button_center{
        margin: 0 auto;
    }

@media screen and (max-width: 960px) {
    .input_calendar{
        width: 100%;    
    }
    input[type="date"] {
        width: 100%;    
    }
    .input_pulldown{
        width: 100%;    
    }   
    .inquiry_inner{
        padding: 0 24px;
    }
    .check_send{
        display: block;
    }
    .check_conteiner{
        margin-top: 96px;
        margin-bottom: 64px;
    }
    .heading-img img{
        margin-left: 0;
        padding:0 24px;
        max-height: 64px;
        width: 100%;
        max-width: 375px;
        height: auto;
        margin-bottom: 24px;
    }
    .check_send #confirmation_button,.check_send .return{
        margin: 32px auto 0 auto;
    }
    .return:active,#confirmation_button:active{
    transition: 0.5s;
    opacity: 0.5;
    }
}