@charset "utf-8";

.md_panelArea { background: url("../../imageFile/about/panel_about.jpg") no-repeat center; background-size: cover; }
.md_panelArea.advantage { background: url("../../imageFile/about/panel_advantage.jpg") no-repeat center; background-size: cover; }
.md_panelArea.concept { background: url("../../imageFile/about/panel_concept.jpg") no-repeat center; background-size: cover; }
.md_panelArea.flow { background: url("../../imageFile/about/panel_flow.jpg") no-repeat center; background-size: cover; }
.md_panelArea.company { background: url("../../imageFile/about/panel_company.jpg") no-repeat center; background-size: cover; }

/*============================
#aboutArea
============================*/
#aboutArea{}
#aboutArea .content { margin-top: 100px; }
#aboutArea .content ul {}
#aboutArea .content ul li { margin-top: 80px; padding-top: 80px; background: url("../../imageFile/global/line_normal.png") repeat-x left top; }
#aboutArea .content ul li:first-child { margin-top: 0; padding-top: 0; background: none; }
#aboutArea .content ul li .image { float: right; width: 600px; }
#aboutArea .content ul li .image img { width: 100%; height: auto; }
#aboutArea .content ul li .data { float: left; width: 440px; }
#aboutArea .content ul li:nth-child(2n) {}
#aboutArea .content ul li:nth-child(2n) .image { float: left; }
#aboutArea .content ul li:nth-child(2n) .data { float: right; }
#aboutArea .content ul li .data .subTitle { font-size: 1.5em; letter-spacing: 0.05em; margin-top: 5px; color: #443d3a; }
#aboutArea .content ul li .data .mainTitle { font-size: 4em; letter-spacing: 0.05em; color: #443d3a; }
#aboutArea .content ul li .data .title { font-size: 1.25em; font-weight: bold; color: #443d3a; }
#aboutArea .content ul li .data .text { line-height: 1.5; margin-top: 20px; }
#aboutArea .content ul li .data .button { margin-top: 20px; }
#aboutArea .content ul li .data .button a.md_btn_sub {}
#aboutArea .content ul li .data .button a.md_btn_sub span {}

/*============================
#advantageArea
============================*/
#advantageArea {}
#advantageArea .content {}
#advantageArea .content ul {}
#advantageArea .content ul li { float: left; width: 520px; margin-right: 60px; margin-top: 60px; }
#advantageArea .content ul li:nth-child(2n) { margin-right: 0; }
#advantageArea .content ul li .image {}
#advantageArea .content ul li .image img { width: 100%; height: auto; }
#advantageArea .content ul li .data {}
#advantageArea .content ul li .data .subTitle { text-align: center; margin-top: -25px; font-size: 4.5em; letter-spacing: 0.05em; color: #443d3a; }
#advantageArea .content ul li .data .title { text-align: center; font-weight: bold; font-size: 1.25em; color: #443d3a; }
#advantageArea .content ul li .data .text { margin-top: 15px; line-height: 1.5; }
#advantageArea .content ul li .data .button { text-align: center; margin-top: 25px; }
#advantageArea .content ul li .data .button a.md_btn_sub {}
#advantageArea .content ul li .data .button a.md_btn_sub span {}

/*============================
#conceptArea
============================*/
#conceptArea {}
#conceptArea .content01 {}
#conceptArea .content01 ul {}
#conceptArea .content01 ul li { margin-top: 40px; }
#conceptArea .content01 ul li .image { float: left; width: 550px; }
#conceptArea .content01 ul li .image img { width: 100%; height: auto; }
#conceptArea .content01 ul li .data { float: right; width: 550px; height: 550px; background: #fff; padding: 0 40px; display: flex; flex-direction: column; flex-wrap: wrap; justify-content: center; }
#conceptArea .content01 ul li .data .title { font-size: 1.375em; font-weight: bold; line-height: 1.5; }
#conceptArea .content01 ul li .data .text { line-height: 1.5; margin-top: 20px; }
#conceptArea .content01 ul li:nth-child(2n) {}
#conceptArea .content01 ul li:nth-child(2n) .image { float: right; }
#conceptArea .content01 ul li:nth-child(2n) .data { float: left; }
#conceptArea .copy01 { margin-top: 60px; line-height: 1.5; text-align: center; }
#conceptArea .copy01 em { font-size: 1.5em; }
#conceptArea .content02 {}
#conceptArea .content02 ul {}
#conceptArea .content02 ul li { float: left; width: 520px; margin-right: 60px; margin-top: 40px; }
#conceptArea .content02 ul li:nth-child(2n) { margin-right: 0; }
#conceptArea .content02 ul li .image {}
#conceptArea .content02 ul li .image img { width: 100%; height: auto; }
#conceptArea .content02 ul li .text { margin-top: 15px; line-height: 2; text-align: center; }
#conceptArea .content02 ul li .text em {}
#conceptArea .copy02 { margin-top: 60px; line-height: 1.75; text-align: center; font-weight: bold; font-size: 1.125em; }

/*============================
#flowArea
============================*/
#flowArea {}
#flowArea .content {}
#flowArea .content ul {}
#flowArea .content ul li { margin-top: 40px; display: flex; align-items: center; padding: 30px 40px; background: #fff url("../../imageFile/global/line_normal.png") repeat-x left top; position: relative; }
#flowArea .content ul li::before { content: ""; position: absolute; bottom: 0; left: 0; width: 100%; height: 1px; background: url("../../imageFile/global/line_normal.png") repeat-x left bottom; }
#flowArea .content ul li::after { content: ""; position: absolute; top: -40px; left: 50%; height: 40px; width: 2px; background: #000; margin-left: -1px; }
#flowArea .content ul li:first-child::after { display: none; }
#flowArea .content ul li .number { font-size: 4.5em; color: #443d3a; letter-spacing: 0.05em; margin-right: 15px; width: 70px; white-space: nowrap; }
#flowArea .content ul li .title { margin-right: 20px; width: 250px; }
#flowArea .content ul li .title .en { color: #aea6a1; font-size: 0.875em; }
#flowArea .content ul li .title .ja { font-weight: bold; font-size: 1.125em; margin-top: 5px; color: #443d3a; }
#flowArea .content ul li .text { line-height: 1.5; width: 420px; margin-right: 30px; }
#flowArea .content ul li .text span { font-size: 0.875em; }
#flowArea .content ul li .action { text-align: right; }
#flowArea .content ul li .action .button {}
#flowArea .content ul li .action .button a {}
#flowArea .content ul li .action .textLink { font-size: 0.875em; margin-top: 15px; text-align: center; }
#flowArea .content ul li .action .textLink a { text-decoration: underline; }
#flowArea .content ul li .action .button a {}
#flowArea .content ul li .action a {}
#flowArea .content ul li .data { height: 520px;}
#flowArea .content ul li .data .sub { padding: 20px 30px; background: #efedec; width: 260px; }
#flowArea .content ul li .data .sub .subTitle { font-weight: bold; text-align: center; }
#flowArea .content ul li .data .sub .subText { line-height: 1.5; margin-top: 10px; }
#flowArea .content ul li .data .sub.contents01 { position: absolute; left: 420px; top: 80px; height: 420px; }
#flowArea .content ul li .data .sub.contents01::before { content: ""; position: absolute; top: -80px; left: 50%; height: 80px; width: 2px; background: #000; margin-left: -1px; }
#flowArea .content ul li .data .sub.contents01::after { content: ""; position: absolute; bottom: -80px; left: 50%; height: 80px; width: 2px; background: #000; margin-left: -1px; }
#flowArea .content ul li .data .sub.contents02 { position: absolute; left: 720px; top: 80px; z-index: 3; }
#flowArea .content ul li .data .sub.contents02::before { content: ""; position: absolute; top: -40px; left: 50%; height: 40px; width: 2px; background: #000; margin-left: -1px; }
#flowArea .content ul li .data .sub.contents02::after { content: ""; position: absolute; top: -40px; left: -170px; height: 40px; height: 2px; width: 300px; background: #000; }
#flowArea .content ul li .data .sub.contents03 { position: absolute; left: 720px; top: 200px; z-index: 1; }
#flowArea .content ul li .data .sub.contents03::before { content: ""; position: absolute; top: -30px; left: 50%; height: 30px; width: 2px; background: #000; margin-left: -1px; }
#flowArea .content ul li .data .sub.contents03::after { content: ""; position: absolute; bottom: -30px; left: 50%; height: 30px; width: 2px; background: #000; margin-left: -1px; }
#flowArea .content ul li .data .sub.contents04 { position: absolute; left: 720px; top: 440px; z-index: 2; }
#flowArea .content ul li .data .sub.contents04::before { content: ""; position: absolute; bottom: -40px; left: 50%; height: 40px; width: 2px; background: #000; margin-left: -1px; }
#flowArea .content ul li .data .sub.contents04::after { content: ""; position: absolute; bottom: -40px; left: -170px; height: 40px; height: 2px; width: 300px; background: #000; }

/*============================
#companyArea
============================*/
#companyArea {}
#companyArea .content {}
#companyArea .content .profile { height: 356px; background: url("../../imageFile/about/bg_company_profile2022.jpg") no-repeat center; position: relative; padding: 60px; margin-top: 40px; }
#companyArea .content .profile .position { font-size: 1.125em; font-weight: bold; }
#companyArea .content .profile .name { margin-top: 15px; }
#companyArea .content .profile .name span.ja { font-size: 3em; font-weight: bold; }
#companyArea .content .profile .name span.en { font-size: 1.25em; margin-left: 20px; letter-spacing: 0.05em; }
#companyArea .content .profile .data { position: absolute; background: #f8f8f8; padding: 20px 20px 16px; left: 60px; top: 190px; width: 460px; }
#companyArea .content .profile .data .subTitle { font-weight: bold; }
#companyArea .content .profile .data .subText { line-height: 1.5; margin-top: 10px; }
#companyArea .content .text { line-height: 1.75; margin-top: 60px; }
#companyArea .content .text em { font-size: 1.125em; }
#companyArea .content .md_subTitle {}
#companyArea .content .main_movie { margin-top: 40px; }
#companyArea .content .main_movie iframe { width: 100%; height: 600px; }
#companyArea .content .main_photo {}
#companyArea .content .main_photo ul {}
#companyArea .content .main_photo ul li { float: left; width: 340px; height: 340px; margin-right: 40px; margin-top: 40px; overflow: hidden; }
#companyArea .content .main_photo ul li:nth-child(3n) { margin-right: 0; }
#companyArea .content .main_photo ul li a { position: relative; display: block; }
#companyArea .content .main_photo ul li a::before { content: ""; position: absolute; top: 0; left: 0; display: block; width: 100%; height: 100%; background: #3d2e27; opacity: 0.3; z-index: 1; }
#companyArea .content .main_photo ul li a img { width: 100%; height: auto; }
#companyArea .content .access { margin-top: 40px; }
#companyArea .content .access .map { float: left; width: 520px; }
#companyArea .content .access .map iframe { width: 100%; height: 628px; border: solid 1px #443d3a!important; }
#companyArea .content .access .main_infomation { float: right; width: 520px; margin-top: 10px; }
#companyArea .content .access .main_infomation table { width: 100%; border-bottom: solid 3px #443d3a; }
#companyArea .content .access .main_infomation table tr {}
#companyArea .content .access .main_infomation table tr th { width: 25%; padding: 15px; line-height: 1.5; border-top: solid 3px #443d3a; }
#companyArea .content .access .main_infomation table tr td { padding: 15px; line-height: 1.5; border-top: solid 3px #443d3a; font-size: 0.875em; }