/*
Theme Name: CYBER_LINKS-Themes
Author: CYBERLINKS CO.,LTD.
Author URI: https://www.cyber-l.co.jp/
Description: CYBER_LINKS-Themes.
Requires at least: 6.5
Tested up to: 6.7
Requires PHP: 8.0
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: cl_ttf_child
*/
* {box-sizing: border-box;}
*, *:before, *:after { box-sizing: inherit;}
@font-face {font-family: 'BIZ UDPGothic';src: url('./assets/fonts/bizudp-gothic/BIZUDPGothic-Regular.ttf') format('truetype');font-weight: 500;font-style: normal;}
html { font-size: 56.8%; box-sizing:border-box; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%;}
@media screen and (min-width: 768px) {
 html { font-size: 62.5%; }
}
body {font-family: "BIZ UDPGothic", sans-serif; font-weight: 500; font-style: normal; height: auto; }
:where(.wp-site-blocks *:focus) {	outline-width: 0px;	outline-style: solid;}
article, aside, details, figcaption, figure, footer, header, main, menu, nav, section, summary {display: block;}
audio, canvas, progress, video {display: inline-block; vertical-align: baseline;box-sizing: border-box;}
audio:not([controls]) { display: none; height: 0;}
[hidden], template { display: none;}
a { background-color: transparent; }
:focus:not(:focus-visible) {outline: 0;}
abbr[title] { border-bottom: 1px dotted;}
b, strong { font-weight: 700;}
dfn { font-style: italic;}
mark { background: #ff0; color: #3E453E;}
small { font-size: 80%;}
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline;}
sup { top: -0.5em;}
sub { bottom: -0.25em;}
img { border: 0;margin: 0;padding: 0;vertical-align: top; height: auto; max-width: 100%; width: auto;}
@media screen and (max-width: 767px) {
 /*.entry-content {width: 100% !important; aspect-ratio: 16 / 9;}*/
 .entry-content iframe { max-width: none !important;  width: 100% !important; height: 100% !important; aspect-ratio: 16 / 9;}
}

select,input,button[type="submit"]{ font-size: 100%;}
.smf-checkbox-control{border:1px solid #3E453E; padding: 10px 30px;}

hr { box-sizing: content-box; height: 0;}
a:focus,
a:active{color:var(--wp--preset--color--blue);}
p:empty{display: none;}
dl > div { display: flex; margin-bottom: 15px}
dt { width: 60px; font-weight: bold; flex-shrink: 0;}
dd { margin: 0; flex: 1;}
.is-layout-constrained > ul,
.is-layout-flow > ul,
.is-layout-constrained > ol,
.is-layout-flow > ol{ margin-bottom: 24px;}

.wp-block-navigation .wp-block-navigation-submenu .wp-block-navigation-item:not(:last-child) {	margin-bottom: 3px;}
.wp-block-navigation .wp-block-navigation-item .wp-block-navigation-item__content {	outline-offset: 0;}
.wp-block-navigation .wp-block-navigation-item ul.wp-block-navigation__submenu-container .wp-block-navigation-item__content {	outline-offset: 0;}
a {	text-decoration-thickness: 1px !important;	text-underline-offset: .1em;}
a {	text-decoration-thickness: 1px !important;	text-underline-offset: .1em;}
.more-link {	display: block;}

/*Typography
----------------------*/
h1, h2, h3, h4, h5, h6, blockquote, caption, figcaption, p { text-wrap: pretty;}
/*h2*/
:root :where(.is-layout-constrained) > h2,
main h2{background-color:var(--wp--preset--color--bg-blue); border-bottom: 1px solid var(--wp--preset--color--blue); padding:28px 20px; margin-block-start: 40px; margin-block-end: 30px; }
:root :where(.is-layout-constrained) > h2.is-style-noStyle,
main h2.is-style-noStyle{background: none; padding: 0; border-bottom:none;}
.entry-content + h2.is-style-noStyle { margin-block-start: 0 !important;}
/*h3*/
:root :where(.is-layout-constrained) > h3,
main h3{border-left: 4px solid var(--wp--preset--color--blue);  padding:20px 20px; margin-block-start: 30px; margin-block-end: 30px; }
:root :where(.is-layout-constrained) > h3.is-style-noStyle,
main h3.is-style-noStyle{background: none; padding: 0; border:none;}
/*h4*/
:root :where(.is-layout-constrained) > h4,
main h4{color: var(--wp--preset--color--blue); margin-block-start: 30px; margin-block-end: 20px; }
:root main :where(.is-layout-constrained) > h4.is-style-noStyle,
main h4.is-style-noStyle{color:var(--wp--preset--color--contrast);}
/*h5*/
:root :where(.is-layout-constrained) > h5,
main h5{margin-block-start: 30px; margin-block-end: 20px; }
/*h6*/
:root :where(.is-layout-constrained) > h6,
main h6{margin-block-start: 30px; margin-block-end: 20px; }
/* home */
.home :root :where(.is-layout-constrained) > h3,
.home main h3{border-left:none; padding:0; margin-block-start:0; margin-block-end: 0;}

/*Layout
----------------------
.wp-site-blocks{overflow: hidden;}
body .wp-site-blocks {overflow: visible !important;}*/
header{ position: relative; z-index: 1;}
.wp-block-query{margin-block-start: 0 !important; }
.wp-site-blocks{position: relative;}

/*Cookie同意
----------------------*/
#cookieBanner{position:fixed; bottom:0; left:0; right:0; background-color:rgba(255,255,255,.95); padding:30px 20px; z-index:9999; font-size: 90%; border-top:2px solid var(--wp--preset--color--bggray); }
#cookieBtn{display: flex; justify-content: center; gap:20px;}
#cookieBtn button{ border-radius: 20px; cursor: pointer; font-size: 100%; padding: 8px 30px; white-space: nowrap;}
#noCookie{border:1px solid var(--wp--preset--color--bggray); background-color: var(--wp--preset--color--base); }
#okCookie{border: none; background-color: var(--wp--preset--color--blue); color: var(--wp--preset--color--base); }
@media (min-width: 768px) {
 #cookieBox{display: flex; justify-content: space-around; flex-wrap: wrap; align-items: center; }
}

/* #mainNav 
-----------------------------*/
@keyframes fadeIn { 0% { opacity: 0;} 100% {opacity: 1;}}

@media (max-width: 599px) {
 /*ヘッダー*/
 header > .wp-block-columns{ margin-top: 10px !important; margin-bottom: 10px !important; flex-wrap: nowrap !important;}
 header h1{ white-space: nowrap;}
 header .wp-block-columns .wp-block-column:nth-child(2){flex-basis: 58px !important;}

 /*開閉ボタン*/
 #mainNav .wp-block-navigation__responsive-container-open,
 #mainNav .wp-block-navigation__responsive-container-close{ width: 46px; height: 46px; background-color:var(--wp--preset--color--bg-blue); flex-direction: column; align-items: center; justify-content: center; font-size: 1.2rem; color:var(--wp--preset--color--blue);}
 #mainNav .wp-block-navigation__responsive-container-close{ top: 8px; right: 20px; left: auto; position: fixed; z-index: 100000;}
 .has-modal-open  #mainNav .wp-block-navigation__responsive-container-open{display: none;}
 #mainNav .wp-block-navigation__responsive-container-open svg,
 #mainNav .wp-block-navigation__responsive-container-close svg{width: 30px; height: 30px; color:var(--wp--preset--color--blue); fill:var(--wp--preset--color--blue); display: block; margin-left: auto; margin-right: auto;}

 /*メニューエリア*/
 /* overflow:hidden → overflow:clip: iOS Safariではposition:fixedの親にoverflow:hiddenがあると子のfixed要素がクリップされる問題を回避 */
 #mainNav .wp-block-navigation__responsive-container.is-menu-open{top:60px; height: calc(100dvh - 60px); overflow: hidden; overflow: clip; border-color: rgba(240,252,255,0.95) !important; padding:10px; animation: fadeIn 0.5s cubic-bezier(0.33, 1, 0.68, 1) forwards; box-shadow: inset 0 8px 8px -8px rgba(0,0,0,0.4);}
 #mainNav .wp-block-navigation__responsive-close{ height: 100%; overflow-y: auto; -webkit-overflow-scrolling: touch;}
 #mainNav .wp-block-navigation__responsive-container.is-menu-open a{color:var(--wp--preset--color--contrast); display: block; width: 100%; padding: 15px 15px 15px 0;}
 .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content{ padding:10px 20px 140px;}
 #mainNav .wp-block-navigation .has-child .wp-block-navigation__submenu-container>.wp-block-navigation-item>.wp-block-navigation-item__content{ padding: 10px 0;}
 #mainNav .wp-block-navigation__responsive-container.is-menu-open a:hover{color:var(--wp--preset--color--blue);}
 #mainNav .wp-block-navigation.items-justified-right { /*reset*/
  --navigation-layout-justification-setting: center !important; --navigation-layout-justify: flex-start !important; width: 100%; }
 #mainNav .wp-block-navigation{gap:0;}
 #mainNav .wp-block-navigation > li{ width: 100%; border-bottom: 1px dashed var(--wp--preset--color--blue); position: relative;text-align: center; padding-right: 40px;}
 #mainNav ul ul{width: 100%; border-top: 1px solid var(--wp--preset--color--blue); margin-bottom: 8px; display: none;}
 #mainNav ul button[aria-expanded="true"] + ul{width: 100%; border-top: 1px dashed var(--wp--preset--color--blue);; margin-bottom: 8px; display: block;}
 #mainNav .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content .has-child .wp-block-navigation__submenu-container{padding-left: 0; padding-right: 0;}
 /*サブメニューボタン*/
 #mainNav .wp-block-navigation .wp-block-navigation__submenu-icon{display: block !important; position: absolute; width:24px; height: 24px; right: 0; top: 15px; margin: auto; border:2px solid var(--wp--preset--color--blue);}
 #mainNav .wp-block-navigation .wp-block-navigation__submenu-icon::before,
 #mainNav .wp-block-navigation .wp-block-navigation__submenu-icon::after { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; background: var(--wp--preset--color--blue); width: 2px; height: 12px; }
 #mainNav .wp-block-navigation .wp-block-navigation__submenu-icon::before{ transform: rotate(90deg);}
 #mainNav .wp-block-navigation button[aria-expanded="true"].wp-block-navigation__submenu-icon{border: none;}
 #mainNav .wp-block-navigation button[aria-expanded="true"].wp-block-navigation__submenu-icon::after{content: none;}
 #mainNav .wp-block-navigation .wp-block-navigation__submenu-icon svg{display: none;}
}

@media (min-width: 600px) {
/* PCではサブメニュー非表示 */
 #mainNav .wp-block-navigation .wp-block-navigation__submenu-icon,
 #mainNav .wp-block-navigation__submenu-container{display: none;}
}

/*トピックパス*/
.breadcrumbs{ color:var(--wp--preset--color--blue);}
.breadcrumbs span{white-space: nowrap; color:var(--wp--preset--color--contrast);}
.breadcrumbs a{text-decoration: none;}
.breadcrumbs a:hover{text-decoration: underline;}

/* #sidebar
-----------------------------*/
:root #sidebar:where(.is-layout-constrained) > h2{ text-align: center; background-color: var(--wp--preset--color--bg-green); border-bottom: none; color: var(--wp--preset--color--contrast); padding: 15px 10px; font-size: 2.0rem; margin: 0 0 20px;}
:root #sidebar:where(.is-layout-constrained) > h2 a{ display: block; color: var(--wp--preset--color--contrast); padding: 15px 10px; }
#sidebar ul{padding-left: 0; margin-block-start: 0;}
:root #sidebar:where(.is-layout-constrained) > h3{ padding-top: 5px; padding-bottom: 5px;}
#sidebar li{list-style: none; border-bottom: 1px dashed var(--wp--preset--color--blue);}
#sidebar li a{ color: var(--wp--preset--color--contrast); display: block; padding: 10px 0;}

#sidebar ul.yearLnks{margin-top: -24px;}

/* Footer
-----------------*/
/*PageTop*/
.pagetop,.pagetop a{ width: 40px; height: 40px; }
.pagetop {	position: fixed; z-index: 9998;	bottom:0; right: 10px;}
.pagetop a {display: flex; align-items: center; position: relative;	background: var(--wp--preset--color--blue);
 color: var(--wp--preset--color--base); border-radius: 30px; padding-left: 35px; text-decoration: none; text-indent: -9999px !important;}
.pagetop a::after{ content: "";	position: absolute;	top:17px; right:0; left: 0; margin: auto; height: 15px; width: 15px; border-top: 2px solid var(--wp--preset--color--base);; border-right: 2px solid var(--wp--preset--color--base);; -datawebs_parentkit-transform: rotate(-45deg); transform: rotate(-45deg);}
@media screen and (min-width: 768px) {
 .pagetop {	bottom:10px; right: 20px;}
 .pagetop,.pagetop a{ width: 60px; height: 60px; text-indent: 0;}
 .pagetop a::after{top: 28px;}
}

/* アーカイブ
-----------------
.wp-block-post{box-shadow: 0px 0px 10px rgba(0, 100, 158, 0.25); background: #FFF; font-weight: 700; margin-bottom: 10px; position: relative;}
.wp-block-post h2{margin-bottom: 0 !important;}
.wp-block-post a{background: url("assets/images/ico_arr.svg") no-repeat 96% 50%; padding: 0 35px 0 0; display: block; color: #2A3241;  width: 100%; text-decoration: underline;}
.wp-block-post a:hover{text-decoration: none;}
@media print,screen and (min-width: 768px) {
 .wp-block-post a{ background-position: 98% 50%; background: url("assets/images/ico_arr.svg") no-repeat 94% 50%; padding: 10px 30px 10px 30px;}
 .wp-block-post .wp-block-post-date{margin:0 40px;}
}*/

/* 採用情報
-----------------*/
/*キャッチコピー背景
.bg_recruit{position: relative;}
.bg_recruit::after{content: ""; position: absolute; right: -30px; top: -100px; background: url("assets/images/bg_recruit_main.svg") no-repeat; background-size: contain; width: 324.5px; height:327px; z-index: -1;}
@media print,screen and (min-width: 768px) {
 .bg_recruit::after{width: 649px; height:654px; }
}*/
/*スタッフインタビュー背景
.bg_recruit2{position: relative;}
.bg_recruit2::after{content: ""; position: absolute; right: -30px; bottom: 0; background: url("assets/images/bg_recruit_main2.svg") no-repeat; background-size: contain; width: 252px; height:69px; z-index: -1;}
@media print,screen and (min-width: 768px) {
 .bg_recruit2::after{width: 754px; height:207px; }
}*/
/*座談会背景
.bg_motif{position: relative;}
.bg_motif::before{content: ""; position: absolute; top:0; right: 0; bottom: 0; left: 0; margin: auto; width: 100%; height: 100%; background: url("assets/images/bg_motif.svg") no-repeat; background-size: cover;mix-blend-mode: screen;}
.bg_motif > *{z-index: 1; position: relative;}
*/
/*スタッフインタビュー一覧
#interviewList {max-width: 1170px; width: 100%; margin-bottom: 50px;}
#interviewList ul{ padding-left: 0; }
#interviewList li{list-style: none; border-radius: 20px; background-color: #ECF6FF; overflow: hidden; position: relative; margin-bottom: 30px;}
#interviewList li a{display: flex; flex-direction: column; text-decoration: none;}
#interviewList li a:hover img{transform: scale(1.05, 1.05); transition: 1s all;}
#interviewList img{max-width: 360px; width:100%; height: 270px; object-fit: cover;object-position: 60% 50%;}
#interviewList .innerBox{ padding: 10px 15px 15px;}
#interviewList .inyear{ color: #2A3241; font-size: 1.4rem; font-weight: 700;}
#interviewList h3{ font-size: 2.0rem; border: none; padding: 0; margin: 10px 0 20px;}
#interviewList .termTag{ border-radius: 5px; background-color: #2CCE88; color: #FFF; font-size: 1.3rem; padding: 8px 20px;}
@media print,screen and (min-width: 768px) {
 #interviewList ul{display: flex; flex-wrap: wrap; gap:3.3%; }
 #interviewList li{width: 30%;}
 #interviewList .inyear{ font-size: 1.6rem;}
 #interviewList .innerBox{ padding: 20px 30px 30px;}
}
*/
/*スタッフインタビュー詳細
#eyechatchBox {position: relative;}
#eyechatchBox .wp-block-post-featured-image{width: auto !important; height: auto !important;}
#eyechatchBox .wp-block-post-featured-image img{ max-width: 100%; height: auto; width: auto;}
#dataBox{position: absolute; top: 0; left: 0; height: 100%; width: 100%; align-content: center; color: #FFF; padding: 20px;}
#dataBox .wp-block-post-terms{margin-right: auto !important;}
#dataInfo{ display: flex; gap:20px; align-items: baseline; width: 100%;}
#initial{ font-size: 2.0rem; font-weight: 700;}
#interviewDate .wp-block-post-date{white-space: nowrap;}
@media print,screen and (max-width: 767px) {
 #interviewDate {display: block; text-align: right;}
}
@media print,screen and (min-width: 768px) {
 #dataBox{ padding: 40px;}
 #initial{ font-size: 3.0rem;}
}

*/