/*
Theme Name: CYBER_LINKS-Themes
Author: the WordPress team
Author URI: https://wordpress.org
Description: CYBER_LINKS-Themes.
Requires at least: 6.7
Tested up to: 6.7
Requires PHP: 7.2
Version: 1.1
License: GNU General Public License v2 or later
License URI: http://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-size: 1.8rem; overflow-x: hidden; min-width: 320px;font-family: "BIZ UDPGothic", sans-serif; font-weight: 500; font-style: normal;}
: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: #29BBE8;}
p:empty{display: none;}
dl {}
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;}
h1, h2, h3, h4, h5, h6, blockquote, caption, figcaption, p {	text-wrap: pretty;}

/*Typography
----------------------*/
.is-layout-constrained > p,
.is-layout-flow > p{margin-bottom: 24px;}
.is-layout-constrained > h1, .is-layout-constrained > h2, .is-layout-constrained > h3,
.is-layout-flow > h1, .is-layout-flow > h2, .is-layout-flow > h3{
 margin-top: 40px; margin-bottom: 30px; line-height: 1.2; }
.is-layout-constrained > h4, .is-layout-constrained > h5, .is-layout-constrained > h6,
.is-layout-flow > h4, .is-layout-flow > h5, .is-layout-flow > h6{
 margin-top: 30px; margin-bottom: 20px; line-height: 1.2;}
h1 {font-size: 3.0rem; }
h2 {font-size: 2.8rem; color: #1A65D6;}
h3 {font-size: 2.6rem; color: #1A65D6; padding-bottom: 15px; border-bottom: 2px dotted #B4DDF9; margin-bottom: 30px;}
h4 {font-size: 2.4rem; }
h5 {font-size: 2.2rem; }
h6 {font-size: 2.0rem; }
#interviewArea h1{font-size: 3.0rem;}
#interviewArea h2{font-size: 3.0rem; color: #1A65D6; padding-bottom: 15px; border-bottom: 2px dotted #B4DDF9; margin-top: 40px; margin-bottom: 30px;}
@media screen and (min-width: 768px) {
 .is-layout-constrained > h1, .is-layout-constrained > h2, .is-layout-constrained > h3,
.is-layout-flow > h1, .is-layout-flow > h2, .is-layout-flow > h3{ margin-top: 70px; margin-bottom: 50px; }
.is-layout-constrained > h3, .is-layout-flow > h3,
.is-layout-constrained > h4, .is-layout-constrained > h5, .is-layout-constrained > h6,
.is-layout-flow > h4, .is-layout-flow > h5, .is-layout-flow > h6{ margin-top: 40px; margin-bottom: 30px;}
 h1 {font-size: 5.0rem; }
 h2 {font-size: 3.4rem; }
 h3 {font-size: 2.8rem;}
 h4 {font-size: 2.4rem; }
 h5 {font-size: 2.2rem; }
 h6 {font-size: 2.0rem; }
 #interviewArea h1{}
 #interviewArea h2{ margin-top: 70px;}
}
.is-style-noStyle{border: none; padding: 0;}

/*Layout
----------------------*/
.wp-site-blocks{overflow: hidden;}
header{ position: relative; z-index: 1;}
.wp-block-query{margin-block-start: 0 !important; }
.wp-site-blocks{position: relative;}
#mainHead{ box-shadow: 0 3px 6px rgba(0,99,175,0.25);}
#mainHead h1{ display: flex; align-items: center;}
.home #mainHead{ box-shadow: none;}
/*header*/
.home header{position: absolute; top: 0; left: 0; width: 100%; height: 80px; z-index: 9999;}

@media (max-width: 767px) {
 #mainHead{padding-right: 20px !important; padding-left: 20px !important;}
 .home #mainHead{ margin-top: 70px;}
 .home #mainHead > .wp-block-group{padding: 0 !important;}
 .custom-logo-link img{ margin: 10px 0; width: 180px; height: auto;}
}
@media screen and (min-width: 768px) {
 .home header{top: 50px; }
}
body .wp-site-blocks {overflow: visible !important;}

/*Cookie同意
----------------------*/
#cookieBanner{position:fixed; bottom:0; left:0; right:0; background:#EEF1F5; padding:30px 20px; z-index:9999; font-size: 90%; }
#cookieBtn{display: flex; justify-content: center; gap:20px;}
#cookieBtn button{ border-radius: 20px; border: none; cursor: pointer; font-size: 100%; padding: 8px 30px; white-space: nowrap;}
#noCookie{background-color: #D7DEE7; }
#okCookie{background-color: #2A3241; color: #FFF; }
@media (min-width: 768px) {
 #cookieBox{display: flex; justify-content: space-around; flex-wrap: wrap; align-items: center; }
}

/* #mainNav 
-----------------------------*/
#mainNav #menuOpenLogo{display: none;}
@keyframes fadeIn { 0% { opacity: 0;} 100% {opacity: 1;}}
@media (max-width: 767px) {
 #mainNav .wp-block-navigation > li{font-size: 1.4rem !important;}
/*end min-width: 768px*/}
@media (max-width: 599px) {
 /*開閉ボタン*/
 #mainNav .wp-block-navigation__responsive-container-close svg, .wp-block-navigation__responsive-container-open svg{width: 30px; height: 30px;}
 #mainNav .wp-block-navigation__responsive-container-close svg{fill:#FFF;}
 #mainNav > nav > button{flex-direction: column; align-items: center;}
 #mainNav .wp-block-navigation__responsive-container-open,
 #mainNav .wp-block-navigation__responsive-container-close{display: block; font-size: 1.2rem ;text-align: center;}
 #mainNav .wp-block-navigation__responsive-container-close{color: #FFF;}
 .home #mainNav .wp-block-navigation__responsive-container-open  svg{fill:#FFF;}
 .home #mainNav .wp-block-navigation__responsive-container-open span{color:#FFF;}
 /*メニューエリア*/
 #mainNav .wp-block-navigation__responsive-container.is-menu-open{background-color: #1A65D6 !important; padding:10px 20px; animation: fadeIn 0.5s cubic-bezier(0.33, 1, 0.68, 1) forwards;} 
 #mainNav .wp-block-navigation__responsive-container.is-menu-open a{color: #FFF;}
 #mainNav #menuOpenLogo{display: block; position: absolute; left: 20px; top: 10px; width: 180px; z-index: 10;}
 #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__responsive-container-content > ul{margin-top: 50px;}
 #mainNav .wp-block-navigation > li{ font-size: 1.6rem !important; width: 100%; border-bottom: 1px solid #FFF; position: relative;}
 #mainNav ul ul{width: 100%; border-top: 1px solid #FFF; margin-bottom: 8px; display: none;}
 #mainNav ul button[aria-expanded="true"] + ul{width: 100%; border-top: 1px solid #FFF; margin-bottom: 8px; display: block;}
 #mainNav .wp-block-navigation li a{display: block; width: 100%; padding: 5px 0 15px;}
 /*サブメニューボタン*/
 #mainNav .wp-block-navigation .wp-block-navigation__submenu-icon{display: block !important; position: absolute; width:18px; height: 18px; right: 10px; top: 5px;}
 #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: #FFF; border-radius: 2px; width: 2px; height: 100%; }
 #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::after{content: none;}
 #mainNav .wp-block-navigation .wp-block-navigation__submenu-icon svg{display: none;}
  /*お問い合わせボタン*/
.btContact{border-bottom: none !important; max-width: 140px; text-align: center; margin-top: 30px;}
.btContact a{display: block; font-weight: 700; border: 1px solid #1A65D6; border-radius: 10px; padding: 5px 10px !important; background: #FFF; color: #1A65D6 !important; box-shadow: 0 0 10px rgba(0,121,201,0.4);}
.btContact a:hover{background:#1A65D6; color: #FFF;}

}
@media (min-width: 600px) {
 #mainNav .wp-block-navigation,
 #mainNav .wp-block-navigation__responsive-dialog,
 #mainNav .wp-block-navigation .wp-block-navigation-item{ position: static;}
 #mainNav .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) {position: static;}
 #mainNav .wp-block-navigation{flex-wrap:nowrap; }
 #mainNav .wp-block-navigation > li{white-space: nowrap;}
 #mainNav .wp-block-navigation > li a{padding: 20px 0px;}
 
 #mainNav .wp-block-navigation > li a:focus,
 #mainNav .wp-block-navigation > li a:active{color: #29BBE8;}
 #mainNav .wp-block-navigation > li li a{padding:10px 20px; flex-grow: 0 !important;}
 #mainNav .wp-block-navigation > li .wp-block-navigation__submenu-icon.wp-block-navigation-submenu__toggle{display:
 none;}
 #mainNav a:hover{color: #29BBE8;}
 /*submenu*/
 #mainNav .wp-block-navigation .wp-block-navigation__submenu-container{ position: absolute; max-width: 1170px;
 width: 100%; top: 60px; left: 0; right: 0; margin: auto; display: flex; flex-direction: row; flex-wrap: wrap; border: 3px solid #B5DCF9; border-radius: 18px; box-shadow: 0 0 10px rgba(0,99,175,0.25); padding: 30px;}
 #mainNav .wp-block-navigation .wp-block-navigation__submenu-container > li{width: auto; justify-content: center;}
 #mainNav .wp-block-navigation .wp-block-navigation-item{background: none;}
 /*お問い合わせボタン*/
 .btContact a{display: block; font-weight: 700; border: 1px solid #1A65D6; border-radius: 10px; padding: 5px 10px !important; background: #FFF; color: #1A65D6; box-shadow: 0 0 10px rgba(0,121,201,0.4);}
 .btContact a:hover{background:#1A65D6; color: #FFF;}
 .home #mainNav .wp-block-navigation > li > a{color: #FFF; background-color: transparent;}
 .home #mainNav .wp-block-navigation > li.btContact a{ background:#1A65D6; color: #FFF;}
 .home #mainNav .wp-block-navigation > li.btContact a:hover{background: #FFF; color: #1A65D6;}
 /* 子要素1つ目 */
 #mainNav .wp-block-navigation .wp-block-navigation__submenu-container {padding-left: 240px; font-weight: 700;}
 #mainNav .wp-block-navigation .wp-block-navigation__submenu-container > li:first-child{ position: absolute; left: 0; top:30px; bottom: 30px; margin: auto; text-align: center; padding: 20px 0; font-size: 2.0rem; width: 200px;}
 #mainNav .wp-block-navigation .wp-block-navigation__submenu-container > li:first-child a{flex-grow:0;}
 #mainNav .wp-block-navigation .wp-block-navigation__submenu-container > li:first-child::before{ content: "";border-right: 1px solid #677382; position: absolute; top: 0; bottom: 0; right: -1px; }

/*end min-width: 600px*/}
@media (min-width: 768px) {
 #mainNav .wp-block-navigation > li a{padding: 20px 0px;}
 #mainNav .wp-block-navigation .wp-block-navigation__submenu-container{ top: 68px;}
 /*.home #mainNav .wp-block-navigation .wp-block-navigation__submenu-container{ top: 118px;}*/
/*end min-width: 768px*/}

@media (min-width: 900px) {
 #mainNav .btContact a{padding: 10px 20px !important; }
 #mainNav .wp-block-navigation > li a{padding: 20px 15px;}
/*end min-width: 768px*/}

/* ページヘッダー
-----------------*/
.cateArea {padding:0 20px; background-position: 70% center; background-size: cover; margin-top:0; display: inline-block; width: 100%;}
#contentsTitle {max-width: 1170px; width: 100%; margin: 0 auto 30px;}
@media (min-width: 768px) {
 .cateArea {background-position: center center;}
 #contentsTitle {margin: 0 auto 100px;}
}
/*トピックパス*/
#breadcrumb { margin: 0 auto 30px; padding-top: 20px;}
#breadcrumb .pathBox{ display:inline-flex; flex-wrap: wrap; border-radius: 10px; border: 1px solid #B1BFD4; font-size: 1.2rem; padding: 5px 10px; background-color: #FFF;}
#breadcrumb .pathBox span{white-space: nowrap;}
#breadcrumb a{text-decoration: none; color: #2A3241;}
.b_next{color:#2CCE88; padding: 0 5px;}
@media (min-width: 768px) {
 #breadcrumb{ margin: 20px auto 80px; width: 96%;}
}
/* タイトル　*/
#catTit{font-size: 2.8rem; line-height: 1.2; font-weight: 500;}
#contentsTitle .is-style-text-subtitle{font-weight:500; line-height: 1.2;}
@media (min-width: 768px) {
 #catTit{font-size: 5.0rem; margin-bottom: 20px;}
}

/* Footer
-----------------*/
@media (max-width: 767px) {
 #footer .wp-block-navigation__container{ flex-direction: column; align-items:flex-start; }
 #footer .wp-block-navigation__container li{font-size: 1.4rem !important;}
 #footer #iconArea{margin: 30px 0;}
 #footer #iconArea p{text-align: left;}
}
/*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: #2CCE88; color: #FFF; border-radius: 15px; padding-left: 35px; text-decoration: none; text-indent: -9999px !important;}
.pagetop a:hover{background :#77E69B;}
.pagetop a::after{ content: "";	position: absolute;	top:17px; right:0; left: 0; margin: auto; height: 15px; width: 15px; border-top: 2px solid #FFF; border-right: 2px solid #FFF; -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 main{overflow-x:hidden;}
.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;}
}

