@charset "UTF-8";

*, *::before, *::after{
margin: 0;
padding: 0;
box-sizing: border-box;
}

body{
min-width: 1380px;
background-image: url("../img/flower.jpg");
font-family: serif;
}

.container{
width: 1280px;
margin: 0 auto;
position: relative;
}

img{
vertical-align: middle;
max-width: 100%;
height: auto;
}

h1 img{
max-width: 100%;
height: auto;
/*background-color: white;*/
}

h2{
font-size: 102px;
}

h3{
font-size: 72px;
}

h4{
font-size: 48px;
}

h5{
font-size: 36px;
}

p{
font-size: 24px;
}

ul,dl{
font-size: 24px;
}

.check{
position: relative;
}

.check::before{
content: "";
height: 64px;
display: block;
width: 1280px;
border-left: 1280px solid transparent;
border-bottom: 64px solid #fff;
position: absolute;
top: -64px;
left: calc((100% - 1280px) / 2);
}

.check .container{
padding: 60px 0 218px;
background-color: white;
}

.check h5{
text-align: center;
}

.check__list{
text-align: left;
line-height: 2;
padding:0px 205px;
list-style-type: none;
}

.check ul{
margin-top: 20px;
margin-bottom: 20px
}

.check li{
padding-left: 48px;
background-image: url("../img/check.svg");
background-size: 36px;
background-repeat:no-repeat;
background-position:left center;
margin-left: 130px;
}

.arisan{
width: 320px; 
position: relative;
top: -180px;
left: 928px;
}

.roots{
position: relative;
}

.roots::before{
content: "";
height: 118px;
display: block;
width: 1280px;
border-right: 1280px solid transparent;
border-bottom: 118px solid #EDDCC4;
position: absolute;
top: -118px;
left: calc((100% - 1280px) / 2);
}

.roots::after{
content: "";
height: 130px;
display: block;
width: 1280px;
border-right: 1280px solid transparent;
border-top: 130px solid #EDDCC4;
position: absolute;
top: 1558px;
left: calc((100% - 1280px) / 2);
z-index: 1;
}

.roots .container{
background-color: #EDDCC4;
color: #534741;
}

.child_container{
margin-top: -250px;
}

.roots h3{
padding-left: 100px;
}

.roots p{
padding-left: 115px;
padding-bottom: 60px;
}

.tea{
width: 1080px;
margin: 0 auto;
padding-bottom: 56px;
}

.beautyCard{
display: flex;
justify-content: space-between;
font-family: "varela-round";
align-items: center;
}

.beautyCard__image{
width: 540px;
padding: 0 20px;
}

.beautyCard__text{
padding-right: 40px;

}

.beautyCard h4{
padding: 20px 0;
text-indent: -1em;
white-space: nowrap;
}

dl{
font-feature-settings: "palt";
}

dd{
text-indent: 1em;
}

.date .container{
background-color: white;
color: #534741;
overflow: hidden;
}

.dateCard{
display: flex;
margin-top: 150px;
}

.dateCard__image{
width: 878px;
padding-top: 120px;
}

.dateCard__text{
writing-mode: vertical-rl;
white-space: nowrap;
margin: 0 60px 0 auto;
}
.dateCard__text h5{
text-indent: 4em;
font-weight: 100; 
}

.syousai{
padding-left: 60px;
margin-top: -80px;
}

.when{
display: flex;
align-items: baseline;
}

.touhou{
width: 500px;
height: auto;
position: absolute;
top: 1120px;
left: 820px; 
}

.touhou_image{
width: 550px;
height: auto;
display: block;
}

.naiyou{
padding-left: 60px;
padding-top: 160px;
}

.naiyou h5{
padding: 20px 0 10px 15px;
width: 450px;
border-bottom: 1px solid #534741;
margin-bottom: 30px;
}

.syurui h5{
writing-mode: vertical-rl;
font-size: 36px;
position: absolute;
top: 1825px;
left: 200px; 
letter-spacing: 0.25em;
font-weight: 100;
}    

.syurui_image_back{
margin-top: 70px;
margin-left: 280px;
height: 685px;
width: 778px;
background-color: #EDDCC4;
border-radius: 70px;
}

.syurui_setsumei{
position: absolute;
top: 1825px;
left: 590px; 
}

.syurui_setsumei dl{
padding-bottom:105px;
}

.syurui_setsumei dt{
font-size: 30.78px;
padding-bottom:3px;
}

.syurui_setsumei dd{
font-size: 18px;
}

.syurui_image{
height: 120%;
margin-top: -72px;
margin-left: -40px;
}

.syurui_tea_image{
height: 400px;
width: 400px;
margin-top:50px;
margin-left:60px;
margin-bottom:55px;
}

.taiwanCard{
width: 640px;
height: 320px;
background-color:  #EDDCC4;
position: absolute;
top: 2580px;
left: 640px; 
}

.taiwanCard h5{
padding: 15px 0 10px 15px;
margin-bottom: 20px;
margin-left: 27px;
width: 450px;
border-bottom: 1px solid #534741;
}

.card{
display: flex;
justify-content: space-between;
align-items: center;
margin: 0 40px;
}

.card__image{
width: 300px;
height: auto;
}

.card__text{
width: 220px;
}

.people{
list-style-position: inside;
padding-bottom: 250px;
margin-top: 50px
}

.people h5{
padding: 20px 0 10px 15px;
margin-left: 70px;
width: 450px;
border-bottom: 1px solid #534741;
margin-bottom: 30px;
}

.people li{
line-height: 2;
text-indent: 2em;
font-feature-settings: "palt";
margin-left: 40px
}

.totyo{
width: 536px;
height: auto;
position: absolute;
top: 3000px;
left: 720px;
}

.form{
background-color: #fff;
width: 1280px;
margin: 0 auto;
}

.form .container{
width: 888px;
height: 612px;
border: 2px solid #534741;
color: #534741;
background-color: #fff;
align-content: center;
text-align: center;
}

.form h5{
margin: 0 auto;
width: 450px;
border-bottom: 1px solid #534741;
margin-bottom: 34px;
}

.form th{
text-align: right;
padding-right: 1em;
}

input{
padding: 10px 100px; 
border: 1px solid #534741;
}

input:focus{
background-color: #EDDCC4;
outline: 2px solid #998675;
}

[type="text"]{
border-radius: 15px;
font-size: 21px;
margin-bottom: 20px;
}

[type="submit"]{
border-radius: 15px;
font-size: 21px;
background-color: #998675;
color: #fff;
font-family: serif;
border: none;
}

[type="submit"]:hover{
background-color: #EDDCC4;
}

.date{
display: flex;
justify-content: center;
}

footer{
width: 1280px;
margin: 0 auto;
text-align: center;
background-color: #fff;
padding-top: 150px;
}

.logo{
width: 150px;
height: auto;
margin: 0 auto;
}