@charset "UTF-8";

/* CSS Document */


/*PC*/
@media print, screen and (min-width: 768px) {


.hedImg { background: url(../images/booth/hedImg.png) center/cover no-repeat; }


/*
----------------------------*/
.cont01 { width: 70%; padding: 100px 0 0; margin: 0 auto 100px; }
.cont01 h2 { position: relative; font-size: 2.4rem; font-weight: 700; color: #4D4D4D; letter-spacing: 0.1rem; text-align: center; border-bottom: 1px solid #e5e5e5; padding-bottom: 20px; margin-bottom: 50px; }
.cont01 h2 code { position: absolute; bottom: 15px; right: 0; left: 0; margin: auto; z-index: -1; font-size: 8rem; line-height: 1; color: #eee; }
.cont01 p { line-height: 2.4; color: #4D4D4D; margin-bottom: 20px; }


/*
----------------------------*/
.cont02 { position: relative; width: 100%; padding: 100px 20%; margin: 0 auto 100px; background: url("../images/booth/mission_bg.jpg") no-repeat center; background-size: cover; }
.cont02::after { content: ''; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: rgba(0,0,0,0.6); z-index: 0; }
.cont02 h2 { position: relative; font-size: 2.4rem; font-weight: 700; color: #fff; letter-spacing: 0.1rem; text-align: center; border-bottom: 1px solid #e5e5e5; padding-bottom: 20px; margin-bottom: 50px; z-index: 1; }
.cont02 h2 code { position: absolute; bottom: 15px; right: 0; left: 0; margin: auto; z-index: -1; font-size: 8rem; line-height: 1; color: #e56b0070; }
.cont02 p { line-height: 2.4; color: #fff; text-align: center; margin-bottom: 50px; position: relative; z-index: 1; }
.cont02 ul { position: relative; z-index: 1; color: #fff; background: rgba(0, 0, 0, 0.3); padding: 50px; }
.cont02 ul li { display: flex; flex-wrap: wrap; align-items: center;  margin-bottom: 30px; }
.cont02 ul li strong { width: 150px; display: inline-block; font-size: 2.4rem; color: #e56b00; }
.cont02 ul li code { width: calc(100% - 150px); padding: 0 0 0 40px; border-left: 2px solid #e56b00; box-sizing: border-box; line-height: 1.8; font-size: 1.6rem; }


/*
----------------------------*/
.cont03 { width: 70%; padding: 100px 0 0; margin: 0 auto 100px; }
.cont03 h2 { position: relative; font-size: 2.4rem; font-weight: 700; color: #4D4D4D; letter-spacing: 0.1rem; text-align: center; border-bottom: 1px solid #e5e5e5; padding-bottom: 20px; margin-bottom: 50px; }
.cont03 h2 code { position: absolute; bottom: 15px; right: 0; left: 0; margin: auto; z-index: -1; font-size: 8rem; line-height: 1; color: #eee; }
.cont03 p { line-height: 2.4; color: #4D4D4D; text-align: center; margin-bottom: 50px; }
.cont03 .flexbox { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-start; margin-bottom: 80px; }
.cont03 .flexbox .box { width: 45%; margin-bottom: 50px; }
.cont03 .flexbox .box h3 { font-size: 1.8rem; font-weight: 500; color: #e56b00; padding-bottom: 5px; margin-bottom: 20px; border-bottom: 1px solid #e56b00; }
.cont03 .flexbox .box p { background: #f8f8f8; padding: 20px 30px; box-sizing: border-box; font-size: 1.4rem; line-height: 2; color: #4D4D4D; text-align: left; margin-bottom: 0; }


/*
----------------------------*/
.cont04 { width: 100%; padding: 100px 15%; margin: 0 auto 100px; background: #f8f8f8; }
.cont04 h2 { position: relative; font-size: 2.4rem; font-weight: 700; color: #4D4D4D; letter-spacing: 0.1rem; text-align: center; border-bottom: 1px solid #e5e5e5; padding-bottom: 20px; margin-bottom: 50px; z-index: 1; }
.cont04 h2 code { position: absolute; bottom: 15px; right: 0; left: 0; margin: auto; z-index: -1; font-size: 8rem; line-height: 1; color: #e8e8e8; }
.cont04 .flex_wrap { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; flex-direction: row-reverse; margin-top: 80px; }
.cont04 .flex_wrap .txt { width: 40%; margin-bottom: 20px; }
.cont04 .flex_wrap .txt h3 { font-size: 2.4rem; color: #555; margin-bottom: 10px; }
.cont04 .flex_wrap .txt p.read { font-size: 1.2rem; line-height: 1.6; color: #e56b00; border-bottom: 1px dashed #ccc; padding-bottom: 20px; margin-bottom: 20px; }
.cont04 .flex_wrap .txt p { font-size: 1.4rem; color: #555; line-height: 2; }
.cont04 .flex_wrap .img {  width: 55%; }


/*
----------------------------*/
p.foot_txt { text-align: center; margin-bottom: 50px; }
p.btnB { text-align: center; margin-bottom: 100px; }
p.btnB a { position: relative; font-family: 'Noto Serif JP', serif; font-size: 1.4rem; letter-spacing: 0.2rem; padding: 15px 60px 15px 80px; border: 2px solid #333; }
p.btnB a::before {
content: '\f0e0'; /* Font Awesomeのメールアイコンのコード */
font-family: 'Font Awesome 5 Free'; /* Font Awesomeのファミリー名 */
position: absolute;
left: 55px; /* アイコンの左位置 */
top: 52%; /* 垂直中央揃え */
transform: translateY(-50%); /* 垂直中央揃えのため */
font-size: 1.4rem; /* アイコンのサイズ */
}
p.btnB a:hover { box-shadow: 5px 5px 0px 0px rgba(0,0,0,0.2); }
p.btnB a:hover::before { font-weight: 900; }



}






/*sp*/
@media only screen and (max-width: 767px) {


.hedImg { background: url(../images/booth/hedImg.png) center/cover no-repeat; }


/*
----------------------------*/
.cont01 { width: 90%; padding: 80px 0 0; margin: 0 auto 80px; }
.cont01 h2 { position: relative; font-size: 2.2rem; font-weight: 700; color: #4D4D4D; letter-spacing: 0.1rem; text-align: center; border-bottom: 1px solid #e5e5e5; padding-bottom: 20px; margin-bottom: 30px; z-index: 1; }
.cont01 h2 code { position: absolute; bottom: 15px; right: 0; left: 0; margin: auto; z-index: -1; font-size: 6rem; line-height: 1; color: #eee; }
.cont01 p { line-height: 2.4; color: #4D4D4D; margin-bottom: 20px; }


/*
----------------------------*/
.cont02 {position: relative; width: 100%; padding: 80px 5%; margin: 0 auto 80px; background: url("../images/booth/mission_bg.jpg") no-repeat center; background-size: cover; }
.cont02::after { content: ''; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: rgba(0,0,0,0.6); z-index: 0; }
.cont02 h2 { position: relative; font-size: 2.2rem; font-weight: 700; color: #fff; letter-spacing: 0.1rem; text-align: center; border-bottom: 1px solid #e5e5e5; padding-bottom: 20px; margin-bottom: 30px; z-index: 1; }
.cont02 h2 code { position: absolute; bottom: 15px; right: 0; left: 0; margin: auto; z-index: -1; font-size: 6rem; line-height: 1; color: #e56b0070; }
.cont02 p { line-height: 2.4; color: #fff; text-align: center; margin-bottom: 20px; position: relative; z-index: 1; }
.cont02 ul { position: relative; z-index: 1; color: #fff; background: rgba(0, 0, 0, 0.3); padding: 30px; }
.cont02 ul li { margin-bottom: 20px; }
.cont02 ul li strong { font-size: 1.8rem; color: #e56b00; display: block; margin-bottom: 10px; border-bottom: 1px solid #e56b00; }
.cont02 ul li code { line-height: 1.8; font-size: 1.5rem; }


/*
----------------------------*/
.cont03 { width: 90%; padding: 80px 0 0; margin: 0 auto 80px; }
.cont03 h2 { position: relative; font-size: 2.2rem; font-weight: 700; color: #4D4D4D; letter-spacing: 0.1rem; text-align: center; border-bottom: 1px solid #e5e5e5; padding-bottom: 20px; margin-bottom: 30px; }
.cont03 h2 code { position: absolute; bottom: 15px; right: 0; left: 0; margin: auto; z-index: -1; font-size: 6rem; line-height: 1; color: #eee; }
.cont03 p { line-height: 2.4; color: #4D4D4D; text-align: center; margin-bottom: 30px; }
.cont03 .flexbox { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-start; margin-bottom: 50px; }
.cont03 .flexbox .box { width: 90%; margin: 0 auto 30px; }
.cont03 .flexbox .box h3 { font-size: 1.6rem; font-weight: 500; color: #e56b00; padding-bottom: 5px; margin-bottom: 20px; border-bottom: 1px solid #e56b00; }
.cont03 .flexbox .box p { background: #f8f8f8; padding: 10px 15px; box-sizing: border-box; font-size: 1.4rem; line-height: 2; color: #4D4D4D; text-align: left; margin-bottom: 0; }


/*
----------------------------*/
.cont04 { width: 100%; padding: 100px 5%; margin: 0 auto 50px; background: #f8f8f8; }
.cont04 h2 { position: relative; font-size: 2.4rem; font-weight: 700; color: #4D4D4D; letter-spacing: 0.1rem; text-align: center; border-bottom: 1px solid #e5e5e5; padding-bottom: 20px; z-index: 1; }
.cont04 h2 code { position: absolute; bottom: 15px; right: 0; left: 0; margin: auto; z-index: -1; font-size: 8rem; line-height: 1; color: #e8e8e8; }
.cont04 .flex_wrap { width: 100%; margin: 50px auto 0; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; }
.cont04 .flex_wrap .txt { text-align: center; margin-bottom: 20px; }
.cont04 .flex_wrap .txt h3 { font-size: 2rem; color: #555; margin-bottom: 10px; }
.cont04 .flex_wrap .txt p.read { font-size: 1.2rem; line-height: 1.6; color: #e56b00; border-bottom: 1px dashed #ccc; padding-bottom: 20px; margin-bottom: 20px; }
.cont04 .flex_wrap .txt p { font-size: 1.4rem; color: #555; line-height: 2; }
.cont04 .flex_wrap .img { width: 100%; }


/*
----------------------------*/
p.foot_txt { text-align: center; margin-bottom: 50px; }
p.btnB { text-align: center; margin-bottom: 80px; }
p.btnB a { position: relative; font-family: 'Noto Serif JP', serif; font-size: 1.4rem; letter-spacing: 0.2rem; padding: 15px 60px 15px 80px; border: 2px solid #333; }
p.btnB a::before {
content: '\f0e0'; /* Font Awesomeのメールアイコンのコード */
font-family: 'Font Awesome 5 Free'; /* Font Awesomeのファミリー名 */
position: absolute;
left: 55px; /* アイコンの左位置 */
top: 52%; /* 垂直中央揃え */
transform: translateY(-50%); /* 垂直中央揃えのため */
font-size: 1.4rem; /* アイコンのサイズ */
}
p.btnB a:hover { box-shadow: 5px 5px 0px 0px rgba(0,0,0,0.2); }
p.btnB a:hover::before { font-weight: 900; }




}