@charset "UTF-8";

section {padding: 100px 0 0;}
@media screen and (max-width: 1120px) {
section {padding: 8.92vw 0 0;}
}
@media screen and (max-width:767px){

}


.message .deray,

.philosophy_list li,
.profile,
.chart,
.shop_pic li{opacity: 0;transform: translateY(30px);transition: opacity .6s ease, transform .6s ease;}
.message .deray.show,

.philosophy_list li.show,
.profile.show,
.chart.show,
.shop_pic li.show{opacity: 1;transform: translateY(0);}




/* =========================================
   Message
========================================= */

.message{width: 1120px; margin: auto;display:grid;grid-template-columns:600px 1fr;gap:60px;align-items:start;}
.message .message_pic {width: 600px;}
.message .message_pic img {	width:100%;height: auto;display:block;border-radius:50%;}
.message .message_text {text-align: left;}
.message .message_text p.english{}
.message .message_text h2.title{}
.message .message_text p.text{font-size: 16px;line-height: 1.6; margin:0 0 1.2em;}
.message .message_text p.name {	margin-top:40px;font-size:22px;font-weight:500;}

@media screen and (max-width: 1120px) {
.message{width: 90vw;max-width: inherit; margin: auto;display:grid;grid-template-columns:43.57vw 1fr;gap:5.35vw;}
.message .message_pic {width: 43.57vw;}
.message .message_text p.text{font-size: 1.42vw;}
.message .message_text p.name {	margin-top:3.57vw;font-size:1.96vw;}
}

@media screen and (max-width:767px){
.message{width: 90vw;grid-template-columns:1fr;gap:3.57vw;}
.message_pic{max-width:60%;margin:auto;}
.message .message_text p.text{font-size: 3vw;}
.message .message_text p.name {font-size:3.6vw;}
}




/* =========================================
Philosophy
========================================= */

.philosophy{text-align:center;background: #eff5f6;padding: 100px 0;}
.philosophy p.text{width:1020px;font-size: 16px;line-height: 1.6;margin:0 auto 50px;}
.philosophy ul{width:max-content;margin:0 auto;padding:0;list-style:none;}
.philosophy ul li{color:#2e91aa;font-size:28px;font-weight:500;line-height:2;text-align:left;}
@media screen and (max-width: 1120px) {
.philosophy{padding: 8.92vw 0;}
.philosophy p.text{width:90vw;font-size: 1.42vw;margin:0 auto 4.46vw;}
.philosophy ul li{font-size:2.5vw;}
}
@media screen and (max-width:767px){
.philosophy p.text{font-size: 3vw;margin:0 auto 5vw;text-align: left;}
.philosophy ul li{font-size:5vw;}
}


/* =========================================
   Profile
========================================= */
.profile {width: 1000px;margin: auto;text-align: left;}
.profile table{width:100%;border-collapse:collapse;}
.profile th{font-size: 20px;line-height: 1.6;width:180px;padding:10px 20px 10px 0;text-align:left;vertical-align:top;font-weight:500;}
.profile td{font-size: 20px;line-height: 1.6;padding:10px 0;vertical-align:top;}
.profile td ul{margin:0;padding:0;list-style:none;column-count:2;column-gap:40px;}
.profile td a{color:#0078c8;text-decoration:none;}
.profile td a:hover{text-decoration:underline;}
@media screen and (max-width: 1120px) {
.profile {width: 90vw;}
.profile th{font-size: 1.78vw;width:16.07vw;padding:0.89vw 1.78vw 0.89vw 0;}
.profile td{font-size: 1.78vw;padding:0.89vw 0;}
.profile td ul{column-gap:3.57vw;}

}
@media screen and (max-width:767px){
.profile th{font-size: 3vw;width:inherit;padding:2.5vw 2.5vw 2.5vw 0;white-space: nowrap;}
.profile td{font-size: 3vw;padding:2.5vw 0;}
.profile td ul{column-count:1;column-gap:0;}

}



/* =========================================
   Chart
========================================= */
.chart {width: 1280px;margin: auto;}
.chart_pic{border:5px solid #e5e5e5;}
.chart_pic img{width:100%;height: auto;display:block;}
.chart p.text{margin-top:25px;font-size:14px;line-height:1.8;text-align: left;}
@media screen and (max-width: 1300px) {
.chart {width: 90vw;margin: auto;}
.chart_pic{border:0.44vw solid #e5e5e5;}
.chart p.text{margin-top:2.23vw;font-size:1.25vw;}
}
@media screen and (max-width:767px){
.chart p.text{margin-top:2.5vw;font-size:3vw;}
}



/* =========================================
Shop
========================================= */
.shop {width: 1000px;margin: auto;}
.shop h2.shop_title{margin:0 0 40px;font-size:36px;font-weight:500;text-align: left;}
.shop ul{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;list-style:none;padding:0;margin:0 0 100px;}
.shop li{margin:0;}
.shop li .pic_block{border-radius:16px;overflow:hidden;margin-bottom:12px;}
.shop .pic_block img{width:100%;height: auto;display:block;aspect-ratio:4/3;object-fit:cover;transition:.4s;}
.shop li p{margin:0;font-size:14px;line-height: 1.6; text-align: left;}
@media screen and (max-width: 1120px) {
.shop {width: 90vw;}
.shop h2.shop_title{margin:0 0 3.57vw;font-size:3.21vw;}
.shop ul{display:grid;grid-template-columns:repeat(3,1fr);gap:2.67vw;margin:0 0 8.92vw;}
.shop li .pic_block{border-radius:1.42vw;margin-bottom:1.07vw;}
.shop li p{font-size:1.25vw;}

}
@media screen and (max-width:767px){

.shop h2.shop_title{margin:0 0 2.5vw;font-size:4vw;}
.shop ul{display:grid;grid-template-columns:repeat(3,1fr);gap:2.67vw;margin:0 0 8.92vw;}
.shop li p{font-size:3vw;}


}