@charset "utf-8";

/*-----スタイルシート　1910--------------------------------------------*/
/*HTML5 Doctor Reset Stylesheet*/

@import url("rest.css");

/*-------------------------------------------------*/
/*全体設定*/

:root{
--ac1:#F17759;
--ac2:#228373;
--tx1:#1A020B;
--f-not:"Noto Sans JP", sans-serif;
}


h1,h2,h3,h4,h5,h6 {
font-weight: normal;
}
/*--------------------*/


html{
font-size: 20px;
}
.sp_only { display:none;}
body {
width: 100%;
}
#wrapper {
background: #fff;
width:calc(100% - 40px);
max-width: 1000px;
min-width: 400px;
margin: 0 auto;
font-family: var(--f-not);
font-size: clamp(0.7rem,calc(0.3rem + 2vw),1.0rem);
color: var(--tx1);
}
#contents {
width:100%;
margin:0 auto;
line-height: 1.4em;
}

div,section {
justify-content: space-between;
flex-wrap: wrap;
}
p {
/*
line-height: 1.3em;
letter-spacing: 0.02em;
*/
}
img {
width: 100%;
}



/*-------------------------------------------------*/
/*ヘッダー*/
header{
width: 100%;
margin-bottom: max(4vw,24px);
margin-top: max(2vw,12px);
}
header img{
width: 30%;
}



.pagetop {
position: fixed;
padding: 20px 18px;
right: 10px;
bottom: -110px;
z-index: 101;
background: var(--ac2);
font-size: 18px;
text-align: center;
letter-spacing: 0.00em;
transition: 0.7s;
color: #fff;
border-radius: 2vw;
}
.pagetop.act {
bottom: 10px;
}


/*-----フェードアニメーション-----*/
.fade-in {
opacity: 0;
transition-duration: 500ms;
transition-property: opacity, transform;
}
.fade-in-up {
transform: translate(0, 50px);
}

.fade-in-down {
transform: translate(0, -50px);
}

.fade-in-left {
transform: translate(-50px, 0);
}

.fade-in-right {
transform: translate(50px, 0);
}

.scroll-in {
opacity: 1;
transform: translate(0, 0);
}
.delay1{
transition-delay: 0.4s;
}

.delay2{
transition-delay: 0.8s;
}
/*-----スクロールアニメーション-----*/
.scr_act {
/*transition: 0.8s ease-in-out;*/
}
/*-------------------------------------------------*/
/*フッター*/

/*.map-embed {
max-width: 510px ;
height: 280px;
margin: 15px 0px 1px;
padding: 0 0 px ;
overflow: hidden ;
position: relative ;
top: 0 ;
left: 0 ;
background:#CCC;
}
.map-embed > div {
position: absolute ;
top: 0 ;
left: 0 ;
width: 100% ;
height: 100% ;
margin: 0 ;
padding: 0 ;
}
.map-embed img {
max-width: none ;
}
*/
footer {
width: 100%;
position: relative;
overflow: hidden;
}
.foot_box {
display: flex;
margin-bottom: 40px;
position: relative;
z-index: 2;
}


#copyright {
text-align: center;
font-size: 14px;
font-family:var(--f-ftu);
margin-top: 50px;
}


/*-------------------------------------------------*/
/*コンテンツ*/

/*◆◆◆◆◆◆◆◆◆*/
/*◆◆　TOP　◆◆*/

/*--////　main_visual　////--*/
#topview {
display: flex;
justify-content: space-between;
padding-bottom: max(3vw,18px);
}
#topview h1{
width: 100%;
font-size: 1.2rem;
text-align: center;
margin-bottom: max(4vw,24px);
background: var(--ac1);
padding: 1.3vw 0 1.5vw;
color: #fff;
}
#topview h2 {
width: 100%;
margin-bottom: max(2vw,12px);
font-weight: 600;
font-size: 1.4em;
line-height: 1.35em;
}
#topview table {
font-size: 0.9em;
border-collapse: collapse;
height: 100%;
margin: 0 auto max(3vw,24px);
width: calc(70% + 150px);
max-width:100%;
}
#topview table th {
padding: max(1vw,6px) max(3vw,10px);
border: 1px solid #999;
background: #FBD6CD;
}
#topview table td {
padding: max(1vw,6px) max(3vw,10px);
border: 1px solid #999;
}
#topview h3 {
width: 100%;
color: var(--ac1);
margin-bottom: max(1vw,6px);
font-weight: 600;
font-size: 1.2em;
}
#topview p {
width: 100%;
max-width: 520px;
margin-bottom: max(2vw,12px);
}
#topview img {
width: 90%;
margin: 0 auto;
max-width: 440px;
margin-bottom: max(3vw,18px);
}

#yoko {
padding-bottom: max(4vw,24px);
}
#yoko h2 {
width: 100%;
font-size: 1.2rem;
text-align: center;
margin-bottom: max(4vw,24px);
background: #FBD6CD;
padding: 0.8vw 0 1.0vw;
}
#yoko table {
font-size: 0.9em;
border-collapse: collapse;
height: 100%;
margin: 0 auto max(3vw,24px);
width: calc(70% + 150px);
max-width:100%;
}
#yoko table th {
padding: max(1vw,6px) max(3vw,10px);
border: 1px solid #999;
background: #FBD6CD;
}
#yoko table td {
padding: max(1vw,6px) max(3vw,10px);
border: 1px solid #999;
}
#yoko > div {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
width: calc(70% + 150px);
max-width:100%;
margin: 0 auto;
}
#yoko > div img {
width: 48%;
max-width: 450px;
margin-bottom: max(3vw,18px);
}
@media screen and (max-width:799px) {
#yoko > div img {
width: 48%;
max-width: 450px;
}
}
@media screen and (min-width:800px) {
#yoko > div img {
width: 32%;
max-width: 450px;
}
}
#entry {
padding-bottom: max(9vw,54px);
}
#entry h2 {
width: 100%;
font-size: 1.2rem;
text-align: center;
margin-bottom: max(7vw,42px);
background: #FBD6CD;
padding: 0.8vw 0 1.0vw;
line-height: 1.4em;
}
#entry a {
display: block;
width: 60%;
max-width: 550px;
text-align: center;
margin: 0 auto;
font-size: 1.4rem;
background: var(--ac1);
padding: 1.8vw 0 2.0vw;
color: #fff;
border-radius: 1vw;
}
.jobtext {
font-size: 0.85rem;
}
.jobtext h2 {
width: 100%;
font-size: 1.2rem;
text-align: center;
margin-bottom: max(2vw,12px);
margin-top: max(7vw,42px);
background: #FBD6CD;
padding: 0.8vw 0 1.0vw;
}
.jobtext p {
}


/*------------------form.php---------------------*/

.contact_in {
width: 90%;
max-width: 850px;
margin: 0px auto 250px;
position: relative;
}
.contact_in h3 {
width: 100%;
font-size: 1.2rem;
text-align: center;
margin: 0 auto max(3vw,24px);
border: solid 3px #FBD6CD;
padding: 0.8vw 0 1.0vw;
line-height: 1.4em;
}
.formstyle {
display: flex;
justify-content:center;
flex-wrap: wrap;
gap:15px;
}
.formstyle div:not(.formbotarea){
margin: 0 0 18px;
}
.formstyle label {
width: 80%;
min-width: 420px;
margin-top: 20px;
margin-bottom: -5px;
vertical-align: top;
margin-right: 0.5em;
}
.formstyle label span {
color: var(--ac1);
font-size: 150%;
display: inline-block;
line-height: 0;
}
.formstyle input:not(.imbot),
.formstyle textarea,
.formstyle select{
width: 80%;
min-width: 420px;
border:none;
padding: 10px 15px;
border-radius: 7px;
font-family:var(--f-not);
font-weight: 300!important;
font-size: 20px;
background: rgba(255,255,255,0.71);
border: 1px solid rgba(50,50,50,0.18);
}
.formstyle textarea{
font-family:var(--f-not);
font-weight: 300!important;
font-size: 20px;
font-size: 18px;
height: 12em;
}
.formstyle select{
width: 500px;
padding: 14px 15px;
-webkit-appearance: none;
appearance: none;
}
.formstyle .selectdiv{
position: relative;
}
.formstyle .selectarr{
position: absolute;
z-index: 10;
right: 150px;
top: 50%;
line-height: 0;
font-size: 12px;
opacity: 0.5;
}
.formbotarea  {
display: flex;
width: 700px;
margin: 0 auto;
justify-content: center;
padding-top: 30px;
}
.formbotarea p  {
text-align: center;
margin: 0px auto 5px;
width: 100%;
}
.fmbota_cen {
width: 350px;
margin: 0 auto;
}
.formbotarea .submitbtn {
color: #fff;
background: var(--ac1);
padding: 20px 0;
border: none;
font-size: 20px;
width: 240px;
margin: 0 10px;
line-height: 1em;
cursor: pointer;
border-radius: 1vw;
}

.formbotarea .submitbtn:hover {
opacity: 0.8;
}
.formbotarea .submitbtn_op {
background: #888;
}

/*--- フォーム確認画面・最終画面 ----*/

#formWrap {
width: 1100px;
margin: 0px auto;
padding: 150px 0 150px;
}
#rec_kakunin {
}

.kakunin_err {
width: 700px;
margin: 0 auto;
}
.kakunin_err h4 {
text-align: center;
font-size: 22px;
line-height: 1.4em;
margin-bottom: 65px;
}
.error_messe {
width: 490px;
margin: 15px auto;
color:darkred;
}
.formTable {
border-collapse: collapse;
width: 700px;
margin: 50px auto;
}
.formTable th,
.formTable td{
border: 1px solid #aaa;
padding: 12px;
}
.formTable th{
background: #ddd;
width: 180px;
}

.kakunin_ok {
text-align: center;
font-size: 22px;
line-height: 1.4em;
}

.f_kanryo {
width: 700px;
margin: 0px auto;
padding: 150px 0 150px;
}
.f_kanryo p {
margin: 70px 0;
font-size: 22px;
}