/* company top ----------------------------------- */
#company section { width: 100%; padding: 0; max-width: 1080px; margin: 0 auto; text-align: left; }
#comp_top .flex { padding-bottom: 24px; }
.comp_panel { display: block; width: 100%;  border-radius: 10px; box-shadow: 0px 4px 10px 0px #00000014; overflow: hidden; }
.ratio3_2 { width: 100%; aspect-ratio: 3 / 2; }
a .panel_link { display: block; padding: 20px; background: url(/ja/images/common/arrow01.png) right 20px center / 24px no-repeat #fff; color: var(--r_black); text-decoration: none; white-space: nowrap; font-weight: 700; transition: all 0.3s ease; }
a:hover .panel_link { background: url(/ja/images/common/arrow01_h.png) right 20px center / 24px no-repeat var(--r_blue); color: #fff; }
a .panel_link.out { background: url(/ja/images/common/outlink2.png) right 20px center / 24px no-repeat #fff; }
a:hover .panel_link.out { background: url(/ja/images/common/outlink2_h.png) right 20px center / 24px no-repeat var(--r_blue); }
hr, hr.m80{
  max-width:1080px; width:100%;
  height:1px; margin:56px auto; border:0;
  background: linear-gradient( to right, var(--r_blue) 64px, var(--r_gray) 64px );
}
hr.m80{ margin:80px auto; }
#company section#comp_news { padding: 24px 0; }
.cp_sttl { font-size: 28px; font-weight: 700; margin-bottom: 48px; }

.news_item { display: flex; justify-content: flex-start; align-items: baseline; gap: 20px; padding: 28px 0; border-bottom: var(--r_graylin) 1px solid; }
.news_item:first-child { padding: 0 0 28px 0; }
.news_item .date { display: inline-block; color: var(--r_graytx2); font-family: var(--r_popi); font-weight: 500; width: 90px; }
.news_item .label { display: inline-block; color: var(--r_graytx2); font-size: 13px; line-height: 1; border: 1px var(--r_graytx2) solid; padding: 4px 8px 5px; border-radius: 4px; text-align: center; width: 148px; }
.news_item .text { flex: 1; line-height: 1.7; }
.news_item .text a:hover { transition: all 0.3s ease; }
.news_item .text a:hover { opacity: .7; }
.news_list { flex: 1; margin-bottom: 28px; }
.eve_tx { color: var(--r_blue); padding-right: 20px; }

#company section#comp_movs { padding: 24px 0; }
#comp_movs a .panel_link { height: 85px; }
#comp_movs a .panel_link:not(.out) { line-height: 45px; }
#comp_movs .flex { margin-bottom: 56px; }
#company section#comp_menu { padding: 24px 0; }
div .panel_link { display: block; padding: 20px; background-color: #fff; color: var(--r_black); text-decoration: none; white-space: nowrap; font-weight: 700; transition: all 0.3s ease; }
.link_box { padding: 0 20px 24px 20px; height: 177px; }
#main25 .link_box ul { margin: 0; border-top: var(--r_gray) 1px solid; padding-top: 15px; }
#main25 .link_box li { font-size: 14px; list-style: none; margin-bottom: 0; }
#main25 .link_box a:hover { color: var(--r_blue); }

.pdf_btn { display: flex; justify-content: center; gap: 20px; padding: 18px 20px; background: url(/ja/images/common/pdf2.svg) right 30px center / 24px no-repeat #fff; box-shadow: 0px 4px 10px 0px #00000014; transition: all 0.3s ease; margin: 30px auto; border-radius: 40px; width: 50%; }
.pdf_btn span { color: var(--r_black); text-decoration: none; white-space: nowrap; font-size: 24px; font-weight: 500; }
.in_pdf_btn { width: 126px }

@media screen and (max-width:767px){ 
	#news { padding: 70px 30px; }
	.news_item { display: block; padding: 18px 0; }
	.news_item .date { font-size: 13px; margin-right: 20px; }
	.news_item .label { font-size: 10px; }
	.news_item .text { display: block; margin-top: 10px; font-size: 13px; }
	a .panel_link { font-size: 14px; padding: 15px 20px; background: url(/ja/images/common/arrow01.png) right 15px center / 18px no-repeat #fff; }
	div .panel_link { 	padding: 15px 20px; }
	#company .flex { margin-bottom: 0; padding-bottom: 0; }
	#comp_top .box3nb, #comp_movs .box3nb, #comp_menu .box3nb { margin-bottom: 24px; }
	#comp_top .box3nb:last-child, #comp_movs .box3nb:last-child, #comp_menu .box3nb:last-child { margin-bottom: 0; }
	hr, hr.m80 { margin: 48px auto; background: linear-gradient( to right, var(--r_blue) 32px, var(--r_gray) 32px );}
	#company section#comp_news { padding: 0; }
	#company section#comp_movs { padding: 0; }
	#comp_movs a .panel_link { height: auto; }
	#comp_movs a .panel_link:not(.out) { line-height: inherit; }
	#company section#comp_menu { padding: 0; }
	#company section#comp_menu .flex { margin-bottom: 36px; }
	#company section#comp_movs .flex { margin-bottom: 36px; }
	.cp_sttl { font-size: 20px; margin-bottom: 32px; }
	.link_box { height: auto; }
	#company #comp_menu .flex { margin-bottom: 36px; }
	.pdf_btn { width: 100%; gap: 5px; padding: 15px 20px; background: url(/ja/images/common/pdf2.svg) right 20px center / 18px no-repeat #fff; }
	.pdf_btn span { font-size: 18px; }
	.in_pdf_btn { width: 80px }
}

/* company detail ----------------------------------- */
#company div.btit {
	font-size: 32px;
	font-family: var(--r_popi);
	color: var(--r_blue);
	font-weight: 400;
	max-width: 1200px;
	margin: 0 auto;
	line-height: 1.5;
}
#company div.btit .ja {
	font-size: 14px;
	font-weight: 700;
	line-height: 1;
	color: var(--r_black);
	font-family: var(--r_noto);
	display: inline-block;
	padding-left: 12px;
}
#company div.btit + h1 {
	font-size: 44px;
	font-weight: 700;
	max-width: 1200px;
	margin: 0 auto;
}

#message p {
	line-height: 2.2;
}
#co_overview .lv3,
#co_overview2 .lv3,
#gallery .lv3,
#gallery .lv3,
#governance .lv3,
#compliance .lv3,
#kihan .lv3,
#internalcontrol .lv3 {
	font-size: 28px;
	margin-bottom: 48px; 
}

#history table th:not(.mon) { font-size: 28px; font-family: var(--r_popi); color: var(--r_blue); line-height: 1; font-weight: 400;}
#history table th .wago { font-size: 14px; font-family: var(--r_noto); color: var(--r_black); font-weight: 700; }

#group h3 + p { margin-bottom: 10px; }
#group .box2 { margin-bottom: 56px; }

#network ul.branch { margin-left: 0; }
#network ul.branch li { list-style: none; }
#network a { transition: .3s ease; }
#network a:hover { color: var(--r_blue); }

#gallery .new_date { display: block; font-family: var(--r_popi); color: var(--r_graytx3); font-size: 12px; margin-top: 10px; }
#gallery .art_list figure { margin-bottom: 20px; }
.contents #gallery p { margin-bottom: 0; }

.uline_tbl { border-collapse: collapse; width: 100%; border-bottom: var(--r_gray) 1px solid; background-color: #fff; }
.uline_tbl th { padding: 32px 24px; text-align: left; font-weight: 700; background-color: var(--r_sky2); border-top: var(--r_blue) 1px solid; }
.uline_tbl td  { padding: 32px 24px; border-top: var(--r_gray) 1px solid; }
.office_title { display: inline-block; width: 300px; }

.uline_tbl th.mon { background-color: #fff; text-align: center; padding: 32px 20px 32px 40px; border-top: 0; position: relative; }
.uline_tbl th.mon:before { content: ""; position: absolute; top: -0.5px; right: 0; display: block; width: 60%; height: 0.5px; background-color: var(--r_gray); }
.uline_tbl th + th.mon { border-top: var(--r_gray) 1px solid; }
.uline_tbl th + th.mon:before {  content: ""; background-color: transparent; }

@media screen and (max-width:767px){ 
	#company div.btit { font-size: 22px; }
	#company div.btit .ja { font-size: 11px; }
	#company div.btit + h1  { font-size: 26px; }
	#co_overview .lv3,
	#co_overview2 .lv3,
	#gallery .lv3, #gallery .lv3,
	#governance .lv3,
	#compliance .lv3,
	#kihan .lv3,
	#internalcontrol .lv3 { font-size: 20px; margin-bottom: 28px; }
	.uline_tbl th, .uline_tbl td { width: 100%; display: block; padding: 16px;}
	.office_title { width: 200px; }
	#history .uline_tbl th.mon { text-align: left; padding: 16px 16px 0 16px; }
	#history .uline_tbl td { border-top: 0; padding: 4px 16px 16px 16px; }
	#history .uline_tbl th.mon:before { width: 100%; }
	#history table th:not(.mon) { font-size: 24px; }
	#history table th .wago { padding-left: 1em; }
}

#compliance .lv3_vline { border: 0; padding: 0; font-size: 28px; margin-bottom: 48px; }
#compliance section { position: relative; }
#compliance section:nth-child(n+2) { margin-top: 80px; padding-top: 80px; }
#compliance section:nth-child(n+2)::before { content: ""; position: absolute; top:0; left: 0; max-width: 1080px; width: 100%; height: 1px; border: 0; background: linear-gradient(var(--r_blue), var(--r_blue)) left top / 64px 1px no-repeat, linear-gradient(var(--r_gray), var(--r_gray)) left top / 100% 1px no-repeat; }
#compliance [class^="lv5"] { margin-bottom: 15px; }
#compliance h4 { margin-bottom: 15px; }

@media screen and (max-width: 767px) {
	#compliance .lv3_vline { font-size: 20px; margin-bottom: 28px; }
}


/* ------------------- gallery ------------------- */
#videoFrame{width:100%;height:100%;}
.modal{display:none;position:fixed;z-index:100000;left:0;top:0;width:100%;height:100%;overflow:auto;background-color:rgba(0,0,0,0.5);}
.modal-content{width:90%;height:calc(90vw/16*9);position:absolute;top:53%;left:50%;transform:translate(-50%,-50%);max-width:1400px;max-height:787.5px;background-color:transparent;overflow:hidden;}
.close{position:absolute;color:#fff;top:10px;right:10px;font-size:28px;font-weight:bold;}
.close:hover,.close:focus{color:#666;text-decoration:none;cursor:pointer;}
#mov_overlay{position:fixed;display:none;width:100%;height:100%;top:0;left:0;right:0;bottom:0;z-index:50;}
.more_link{font-size:14px!important;font-weight:400!important;;color:#369;float:right;padding-top:6px;display: block;}
.com-bpo a { display: inline-block; margin-top: 56px; border-radius: 16px; overflow: hidden; box-shadow: 1px 3px 10px 0.5px rgb(0 0 0 / 10%); transition-property: opacity; transition-duration: 0.5s; }

/* ------------------- network ------------------- */
#main25 ul.branch li {
	list-style: none;
}

/* ------------------- brand ------------------- */
#brandvideo { overflow: hidden; margin-bottom: 80px!important; }
#brandvideo #video_background { width: 100%; position: relative; }
#video { width: 100%; aspect-ratio: 16 / 9;  border-radius: 16px;}
#brandvideo .video { width: 100%; border-radius: 16px; }
#brandvideo .btn01 { position: absolute; top: 80%; left: 50%; transform: translateX(-50%); border: 0; font-family: inherit; }
/* #video { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 177.77777778vh; height: 56.25vw; min-height: 100%; min-width: 100%; } */
@keyframes fadeIn { 0% { opacity: 0; } 100% { opacity: 1; } }
@keyframes fadeOut { 0% { opacity: 1; } 100% { opacity: 0; } }
#modal { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0,0,0, 0.7); z-index: 100000; opacity: 0; animation: fadeIn 0.5s backwards; }
#modal.show { display: block; opacity: 1; }
#modal.show.fadeOut { animation: fadeOut 0.5s ease-in-out forwards; }
#modal_content { position: absolute; top: 53%; left: 50%; transform: translate(-50%, -50%); width: 90%; height: calc( 100vw * 0.9 / 16 * 9 ); max-width: 1400px; max-height: 787.5px; background-color: #000; overflow: hidden; }
.close_button { position: absolute; top: 5px; right: 10px; font-size: 24px; font-weight: bold; color: #fff; cursor: pointer; }

.brn_box { margin-bottom: 80px; text-align: center; background: url(/ja/company/images/brand_bg.jpg) top center / 100% no-repeat; border: 1px var(--r_gray) solid; border-radius: 16px; padding: 64px; }
.brnh2 { font-size: 24px; font-weight: 700; color: var(--r_blue); margin-bottom: 40px; }
.brnh3 { font-size: 26px; font-weight: 700; margin-bottom: 30px; }
.prs_body { font-size: 18px; font-weight: 500; }
#voice .brn_box:hover { opacity: 0.8; cursor: pointer; }
.vc_tx { width: 450px; margin-bottom: 36px; }
.open_arrow { width: 48px; border-radius: 6px; transform: rotate(0); transition: all .3s ease; }
.open .open_arrow { transform: rotate(180deg); }
.body_panel { width: 100%; border-radius: 10px; background-color: rgba(235, 249, 255, .7); padding: 72px 64px; margin-bottom: 40px; }
.body_panel_s { width: 100%; border-radius: 10px; background-color: rgba(235, 249, 255, .7); padding: 40px 64px; margin-bottom: 16px; }
.body_panel_s:last-child { margin-bottom: 0; }
.voice_state { font-size: 18px; font-weight: 500; line-height: 2.1; }
.comment { font-size: 12px; line-height: 1.8; }
#aboutlogo .flex { display: flex; flex-direction: row; }
.box64_4 { width: 38%; }
.box64_6 { width: 58%; }
.brnh2j { font-size: 28px; font-weight: 700; line-height: 1.4; margin-bottom: 48px; }
#aboutlogo .box64_6 { line-height: 2.2; }
.under_logo { display: block; max-width: 310px; width: 80%; margin: 20px auto; }

@media (max-width: 767px) {
	#brandvideo { width: 100%; aspect-ratio: 1 / 1; border-radius: 16px; margin-bottom: 48px !important;}
	#brandvideo #video_background { height: 100%; width: auto; }
	#video { width: auto; height: 100%; position: absolute; top: 0; left: 50%; transform: translateX(-50%);}
	.brn_box { padding: 32px 24px; background: url(/ja/company/images/brand_bg_sp.jpg) top center / 100% no-repeat; margin-bottom: 48px; }
	.brnh2 { font-size: 16px; margin-bottom: 12px; }
	.prs_body { font-size: 14px; line-height: 1.6; }
	.vc_tx { width: 100%; max-width: 450px; margin-bottom: 16px; }
	.open_arrow { width: 32px; }
	.body_panel { padding: 24px 16px; }
	.voice_state { font-size: 14px; }
	.comment { font-size: 10px; text-align: left; }
	.brnh3 { font-size: 18px; margin-bottom: 10px; }
	.body_panel_s { padding: 24px 16px; }
	.brnh2j { font-size: 20px; margin-bottom: 28px; }
	#aboutlogo .flex { flex-direction: column-reverse; }
	.box64_4, .box64_6 { width: 100%; }
	.under_logo { width: 75%; margin: 30px auto 0; }
}

/* -------------- bpo_bnr ----------------*/
#bpo_bnr {background: #ebf9ffb3; padding: 80px 30px; }
.bpo_bnrs { display: block; border-radius: 10px; max-width: 1200px; margin: 0 auto; }
@media (max-width: 767px) {
	#bpo_bnr {padding: 40px 30px; }
}
