@charset "UTF-8";
@font-face { font-family:"FAsolid"; src:url("./fa-solid-900.woff") format("woff"); }
@font-face { font-family:"FAregular"; src:url("./fa-regular-400.woff") format("woff"); }

body{font-family: "游ゴシック", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, sans-serif;line-height: 2;}
.sp { display: none;}
.txt_notes { margin-top: 2em; font-size: 85%;}
.txt_notes li { padding-left: 1em; text-indent: -1em;}
.center { text-align: center;}
.bg_lightgray { background: #f0f0f0;}
.subNavi { display: none;}
@media (max-width: 1099px){
	.subNavi { display: flex; top: 75px;}
	.subNavi li { background: #f0f0f0; margin: 1px;}
	.subNavi li a { display: flex; flex-wrap: wrap; justify-content: center; align-content: center; height: 100%; line-height: 1.2;}
}
@media (max-width: 960px){
	.subNavi { top: 70px;}
}
@media (max-width: 699px){
	.subNavi { top: 58px;}
}
@media (max-width: 599px){
	.sp { display: block;}
	.pc { display: none;}
	.subNavi li:not(:last-of-type) { border: none;}
}
@media (max-width: 370px){
	.subNavi { top: 48px;}
}



#topvisual { background: none; height: auto; text-align: center;}
#topvisual .main_visual { position: relative;}




.top_features_list { justify-content: center; text-align: center;}
.top_features_list > li { max-width: 360px; width: calc( 33% - 4vw ); margin: 2vw;}
.top_features_list .icon_area { max-width: 300px; margin: 0 auto 0.8em;}
.top_features_list dt { font-weight: bold; font-size: clamp( 16px, 2.5vw, 24px ); color: #555; line-height: 1.4; margin-bottom: 0.5em;}
.top_features_list dt > .txt_ul { background: linear-gradient(transparent 60%, yellow 0%);}
.top_features_list dt .small { font-size: 80%;}
.top_features_list dt .large.num { font-size: 120%; line-height: 1; display: inline-block;}
.top_features_list dd { font-size: clamp( 10px, 1.5vw, 18px ); line-height: 1.4;}
@media (max-width: 1099px){
	.top_features_list > li { width: calc( 33% - 3em ); margin: 1em 1.25em;}
}
@media (max-width: 599px){
	.top_features_list { justify-content: space-between; padding: 0 1em;}
	.top_features_list > li { width: calc( 33.33333333% - 0.75em ); margin: 1em 0 0;}
	.top_features_list dt { font-size: clamp( 12px, 3.5vw, 18px );}
}
@media (max-width: 399px){
	.top_features_list > li { width: calc( 33.33333333% - 0.5em );}
}


.cta ul.flex { justify-content: center;}
.cta ul.flex li { margin: 1em;}
@media (max-width: 699px){
	.cta ul.flex { justify-content: space-between; padding: 0 4vw;}
	.cta ul.flex li { margin: 0; width: calc( 50% - 0.5em );}
}
@media (max-width: 399px){
	.cta ul.flex li { margin: 0.5em auto; width: 200px;}
}





#methodArea > .inner, #charmArea > .inner, #whatArea > .inner { width: 94vw; max-width: 1600px;}
.charm_list { justify-content: center;}
.charm_list li { width: calc( 33% - 3vw ); margin: 0 1.5vw;}
.charm_list dt { background: rgba(203,6,75,0.10); text-align: center; border-bottom: 2px #CB064B solid; margin-bottom: 15px; font-size: clamp( 21px, 1.25vw, 24px ); padding: 12px 10px 10px; color: #676767; font-weight: bold;line-height: 1.4;}
.charm_list dd .txt_area { width: 55%; font-size: 1.2rem; line-height: 1.8;}
.charm_list dd .img_area { width: 40%;}
.charm_list dd { display: flex; justify-content: space-between; flex-wrap: wrap;}
.charm_list + h3 { text-align: center; font-weight: bold; font-size: clamp( 24px, 8vw, 40px ); margin-top: 1.5em;}
.charm_list + h3 > span { background: linear-gradient(transparent 60%, yellow 0%);}
@media (max-width: 1399px){
	.charm_list li { width: calc( 50% - 3vw );}
	.charm_list li:not(:last-of-type) { margin-bottom: 2em;}
}
@media (max-width: 999px){
	.charm_list li { width: 100%; max-width: 800px; margin: auto;}
	.charm_list dt { padding: 0.2em 0.2em 0; font-size: clamp( 21px, 4vw, 30px );}
	.charm_list dd { align-items: center;}
	.charm_list dd .txt_area { font-size: clamp( 18px, 2.5vw, 24px );}
}
@media (max-width: 799px){
	.charm_list li { width: 100%;}
	/*.charm_list li, .charm_list li:nth-of-type(-n+2) { margin-top: 4vw;}*/
}
@media (max-width: 499px){
	.charm_list dt { font-size: clamp( 16px, 4vw, 24px ); line-height: 1.4;padding: 0.5em 0.2em;}
	.charm_list dd .txt_area { font-size: clamp( 14px, 3.5vw, 18px ); line-height: 1.6;}
}
@media (max-width: 399px){
	.charm_list dd .txt_area { font-size: 0.85rem;}
}



.resultset { align-items: center; justify-content: center; flex-direction: row-reverse; max-width: 800px; margin: 2em auto;}
.resultset .imgArea { width: 40%; max-width: 300px;}
.resultset .txt_area { width: 60%;max-width: 400px;}
.resultset .txt_area .flex { justify-content: flex-start; align-items: center;}
.resultset .txt_area li:not(:last-of-type) { margin-bottom: 1em;}
.resultset .icon_area { width: 80px; height: 80px; margin-right: 20px;}
.resultset .icon_area img { object-fit: contain; width: 100%; height: 100%;}
.resultset .manzokudo dt { background: none; border: none; margin: 0 0.25em 0 0; padding: 0; text-align: left; font-size: 2rem; color: #333; line-height: 1; font-weight: bold;}
.resultset .manzokudo dd { font-size: 2.5rem; font-weight: bold;}
.resultset .co01{ background: linear-gradient(transparent 80%, #ffdc00 80%);}
@media (max-width: 799px){
	.resultset { justify-content: space-between;}
}
@media (max-width: 699px){
	.resultset .manzokudo dd{font-size:5.8vw;line-height: 1.4;}
	.resultset .manzokudo dt{font-size: 4.8vw;}
	.resultset .icon_area{ width:10vw;height:10vw;margin-right: 10px;}
}
@media (max-width: 599px){
	.resultset .txt_area li:not(:last-of-type){margin-bottom: 0.5em;}
}



@media (max-width: 599px){
	.courseList dt.cateName{padding: 10px 35px 10px 10px;}
	.courseList .inrList li{padding: 10px 25px 10px 10px;}
	.open .courseList .subCate.acToggle{padding: 10px 0 8px;}
	.courseList .inrList.inbox li li{padding: 10px 0 10px 10px;}
	#pickupArea ul.pickupBox > li dl.pickupList > dt{height: 60px;}
}



/*===================== 求職者支援訓練 =====================*/

.sh3{
    text-align: center;
    font-size: 2.2rem;
    font-weight: 600;
    margin-bottom: 0.5em;
}

/*
.charm_list{
    margin-bottom: 50px;
}
*/

.charm_list dd .txt_area{
    font-size: 1.05rem;
}

.charm_list dd .txt_area a{
	color: #04c;
}

/* コンタクトボタン */
.cta_btns {padding: 4% 0;}

.cta_btns ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}

.cta_btns ul > li {
	margin: 10px 20px;
	width: 270px;
	max-width: calc( 50% - 40px );
}

.cta_btns ul > li .btn {
	display: block;
	-webkit-transition: all .3s;
	transition: all .3s;
	border-radius: 5px;
	line-height: 1;
	padding: 1em;
	font-size: 17px;
	letter-spacing: .2em;
	text-align: center;
}

.btn--request {
	color: #fff;
	border-bottom: 2px solid #09807c;
	background-color: #32b16c
}

.btn--reserve {
	color: #fff;
	border-bottom: 2px solid #2f7b6c;
	background-color: #32b16c;
}

@keyframes shine {
	100% { left:100%}
}

.shine {
	position: relative;
	overflow: hidden
}

.shine::before {
	position: absolute;
	z-index: 1;
	top: 0;
	left: -55%;
	width: 50%;
	height: 100%;
	content: '';
	-webkit-transform: skewX(-25deg);
	transform: skewX(-25deg);
	background: -webkit-linear-gradient(left, rgba(255,255,255,0) 0, rgba(255,255,255,.3) 100%);
	background: linear-gradient(to right, rgba(255,255,255,0) 0, rgba(255,255,255,.3) 100%)
}
.shine:hover::before {
	-webkit-animation: shine .7s;
	animation: shine .7s
}





/* コンタクトボタン */
.cta_btns ul > li{
    width: 90%;
    max-width: 600px;
}
.cta_btns ul > li .btn{
	font-weight: 600;
	font-size: 25px;
}
@media (max-width: 799px){
	.cta_btns ul > li .btn{font-size: 17px;}
}

/* 求職者支援訓練とは？ */
#whatArea .charm_list{
	margin-top: 50px;
    margin-bottom:30px;
}
#whatArea .charm_list li{
	width: calc(50% - 3vw);
}
#whatArea .toggle_title{
	cursor: pointer;
}
#whatArea .toggle_txt{
    display: none;
    background: #F9EFF1;
   	padding: 50px;
}
#whatArea .secttl{
    border-top: #CB064B 3px solid;
    border-bottom: #CB064B 3px solid;
    padding: 0.5em;
    margin-bottom: 0;
}
#whatArea .secttl.toggle_title:after{
    font-family: FontAwesome;
    content: "\f107";
    font-weight: 900;
    position: static;
    background: none;
    display: inline;
    padding-left: 1em;
}
#whatArea .on .secttl.toggle_title:after{
    content: "\f106";
}
#whatArea .toggle_txt .charm_list dt{
    background: #fff;
}
.toggle_txt a{
	color: #04c;
	text-decoration: underline;
}


@media (max-width: 799px){
	#whatArea .toggle_txt{padding: 1.25em;}
	#whatArea .charm_list{margin-top: 5vw;}
	#whatArea .charm_list li{width:100%;}
}
@media (max-width: 599px){
	.charm_list dd{align-items: flex-start;}
}
@media (max-width: 320px){
	.charm_list dd .img_area{float: left;margin:0 1em 1em 0;}
	.charm_list dd .txt_area{width: 100%;font-size: 1rem;}
	.charm_list dd{display: block;}
}


/* よくある質問 */

#faqArea {
	background: #f5f5f5;
}

#faqArea dt {
	background: #fff;
	border-bottom: 1px solid #666;
	padding: 0 20px 0 3em;
	text-indent: -3em;
	font-weight: bold;
	font-size: 18px;
	margin-bottom: 10px;
}

#faqArea dt span {
	display: inline-block;
	width: 2.5em;
	text-align: center;
	background: #666;
	color: #ff8fc6;
	margin-right: 0.5em;
	text-indent: 0;
}

#faqArea dd{
    padding: 0 0 1.5em 3em;
    position: relative;
}

#faqArea dd span {
	display: inline-block;
	font-weight: bold;
	width: 2.5em;
	background: #ff8fc6;
	border-radius: 50%;
	text-align: center;
	margin-right: 0.5em;
	position: absolute;
    left: 0;
}

@media (max-width: 599px){
	#faqArea dt{line-height: 1.5;}
}

/* 説明会概要 */

.taikenList li .txtArea{
	font-size: 1.4rem;
}
@media (max-width:899px){
	.taikenList li .txtArea{font-size: 1.25rem;}
}
@media (max-width: 599px){
	.taikenList li .txtArea{font-size: 1rem;}
}


/* ヘッダー */
#header-menu_pc li{
    margin-right: 0;
    width: 180px;
}
#header-menu_pc li a span{
	font-size: inherit;
}
#header-menu_pc li a{
    padding: 0.5em;
    line-height: 1;
}
.headPC ul.dropdown li.pli{
    width: auto;
}
.headPC ul.dropdown li.pli > a span{
    font-size: inherit;
    display: inline;
    font-weight: inherit;
}
.headPC ul.dropdown li.dib{
    display: inline;
}
.subNavi li{
	width: 33.33333333%;
}
@media (max-width: 1250px){
	#header-menu_pc li{width: 180px;padding: 3px 0 5px;}
}
@media (max-width: 959.999px){
	.headpc{display: block !important;}
	#header-menu_pc li:hover{background:none;box-shadow:inherit;}

}

/* フッター */
.footSP address a{
    line-height: 1.2;
}
.footSP address p.time{
    margin: 0 auto 1em;
   line-height: 1.5;
}
.footPC .column03{
	border-left: none;
	padding: 0;
	width: 100%;
	display: flex;
}
.footPC .column03 h2{
    margin-right: 2em;
}
.footPC .column03 h3{
    font-size: 18px;
    font-weight: bold;
    margin-bottom:0;
    height: inherit;
}
.f_info .tel{
	font-size: 230%;
    font-weight: bold;
    font-family: monospace;
    text-align: left;
}
.f_info .tel:before{
    font-family: FontAwesome;
    content: "\f879";
    font-weight: 900;
    font-size: 80%;
    margin-right: 0.25em;
}
.footPC .column03 p {
    height: inherit;
    line-height: 1;
    margin-bottom: 0.25em;
}



/*募集中の訓練一覧*/
#information > .inner { background: #d5eff9; padding: 1em 0.5em; box-shadow: 5px 5px 0 #c2dbe5; max-width: 94vw; width: 800px;}
#information h2 { font-weight: bold; font-size: clamp( 14px, 4vw, 24px ); text-align: center;}
.boshu_list { background: white; padding: 0.5em 1em; max-width: calc( 100% - 2em ); margin: 1em auto;}
.boshu_list > li { display: flex; flex-wrap: wrap; padding: 0.5em; column-gap: 1em;}
.boshu_list > li:not(:last-of-type) { border-bottom: dotted 1px #999;}
#information .note { padding-left: 1em; text-indent: -1em; line-height: 1.4; max-width: calc( 100% - 2em ); margin: 0.5em auto 0;}
@media (max-width: 499px){
	.boshu_list { max-width: 100%;}
	.boshu_list > li > span:first-of-type { width: 100%;}
	#information .note { max-width: 100%; font-size: 87.5%;}
}



.course_contents .basic { background: #FFF6E1;justify-content: space-between;}
.course_contents .standard { background: #FFE299;}
.course_contents dl { padding:3% 3% 1.5%; margin-top: 3%;}
.course_contents dt { font-weight: bold; text-align: center; font-size: 150%;}
.course_contents dd { background: #1a7ec3; color: #fff;padding: 0.7em 0.7em 0.7em 3.5em; position: relative;font-size: 120%;font-weight: bold;margin-bottom:1.5%;}
.top_curriculum_list .course_contents dd{width: 49.25%;}
.course_contents dd .icon { display: block; height: 2.5em; width: auto; aspect-ratio: 1 / 1; position: absolute; left: 0.5em; top: 0.5em;}
.course_contents .advanced { width: 100%; background: #F7C548; margin-top: 0; column-gap: 2em;}
.course_contents .advanced dt { width: 100%;}
.course_contents .advanced dd { width: calc( 50% - 1em );}
@media(max-width: 799px) {

}
@media(max-width: 599px) {
	.course_contents .basic, .course_contents .standard, .course_contents .advanced { column-gap: 1em;}
	.course_contents .basic, .course_contents .standard { width: 100%; display: flex; flex-wrap: wrap;}
	.course_contents .standard { margin-top: 0;}
	.course_contents .basic dt, .course_contents .standard dt { width: 100%;}
	.course_contents .basic dd, .course_contents .standard dd, .course_contents .advanced dd { width: calc( 50% - 0.5em );}
}
@media(max-width: 499px) {
	.course_contents .basic dd, .course_contents .standard dd, .course_contents .advanced dd { width: 100%;}
}



#topvisual{
	background:url(../images/bg_h1.jpg) center no-repeat;
	background-size: cover;
	display: flex;
    justify-content: center;
    align-items: center;
    min-height: 550px;
}
.main_visual{
    padding:0 2.5%;
    position: relative;
}
#topvisual h1{
	font-size: 4.25rem;
    color: #fff;
    font-weight: bold;
    line-height: 1.4;
}
#topvisual h1 .mainttl{
    display: block;
    margin-bottom: .25em;
}
#topvisual h1 .mainttl span{
	font-size: 60%;
    color: #111;
    background: #fff;
    padding: 0 1em;
    border-radius: 30px;
}

.flex.top_curriculum_list, .outline_list .flex, .outline_list .detailArea .point_list{
    justify-content: space-between;
}
.top_curriculum_list > li:first-of-type, .top_curriculum_list > li:nth-of-type(2){
	width: 48%;
	margin-bottom: 3%;
}
.top_curriculum_list li:last-of-type{
	width:100%;
}
.top_curriculum_list li > dl > dt{
    background: rgba(203, 6, 75, 0.10);
    text-align: center;
    border-bottom: 2px #CB064B solid;
    margin-bottom: 15px;
    font-size: clamp(21px, 1.25vw, 24px);
    padding: 12px 10px 10px;
    color: #676767;
    font-weight: bold;
    line-height: 1.4;
}
.top_curriculum_list dd{
    width: 100%;
}
.list_subject li{
	padding-left:1em;
	position: relative;
	line-height: 1.5;
    margin-bottom: 0.25em;
}
.list_subject li:before{
	content:"●";
	font-size:60%;
	position: absolute;
    left: 0.25em;
    top: 0.4em;
    color:#565656;
}
.outline{
    background:#FFF7EA;
    padding-top:0;
}
.outline_list{

}
.outline_list > li:not(:last-of-type){
	margin-bottom: 4%;
}
.bg_white, .outline_list .box {
	background: #fff;
    padding:2.5%;
}
.outline_set dd .box:not(:last-of-type){
    margin-bottom: 3%;
}
.outline_set dt{
	background:#f5a500;
    color: #fff;
    /*border-radius: 30px;*/
    text-align: center;
    margin: 0 auto 1em;
    font-size: 2.25rem;
    font-weight: bold;
    padding:0.25em;
}
.outline_set dt .deco{
	position: relative;
}
.outline_set dt .deco:before, .outline_set dt .deco:after{
	content:"";
	position: absolute;
	border-left: 3px #fff solid;
	bottom: 0;
    height: 1.25em;
}
.outline_set dt .deco:before{
	left: -1em;
	transform:rotate(-30deg);
}
.outline_set dt .deco:after{
	right: -1em;
	transform:rotate(30deg);
}
.outline_set dd h3{
	font-size: 2.5rem;
    text-align: center;
    font-weight: bold;
    line-height: 1.4;
}
.outline_set dd h4{
    color: #1a7ec3;
    font-size: 2rem;
    text-align: center;
    font-weight:bold;
    margin-bottom: 1em;
    line-height: 1.4;
}
.outline_list .flow_list{
	width: 25%;
}
.outline_list .flow_list li{
	background: #ccc;
    padding:0.75em 0.25em;
    text-align: center;
    color: #fff;
    font-size: 115%;
   line-height: 1.2;
}
.outline_list .flow_list li.on{
	background: #ED5F92;
}
.outline_list .flow_list li:not(:last-of-type){
    margin-bottom: 25px;
    position: relative;
}
.outline_list .flow_list li:not(:last-of-type):after{
    font-family: FontAwesome;
    content: "\f107";
    font-weight: 900;
	position: absolute;
	bottom: -36px;
    left: 0;
    right: 0;
    color: #ccc;
    font-size: 200%;
}
.outline_list .detailArea{
	width: 72%;
}
.outline_list .detailArea .imgArea{
    position: relative;
    margin-bottom: 40px;
}
.outline_list .detailArea .point_list li{
	width: 48%;
}
.outline_list .detailArea .imgArea .imgTxt{
	content:"";
	position: absolute;
	right:0;
	top:0;
	background: #CB064B;
    color: #fff;
    padding: 0.5em;
    line-height: 1;
    font-size: 110%;
    letter-spacing: 1px;
    font-weight: 500;
}
.b02 .imgArea{
    padding-top: 40px;
    background: #FFF5EE;
}
.outline_set .box h3{
    margin-bottom:2.5%;
}
.outline_set .box h4{
    margin-bottom: 0;
}
.point_list li{
	border: #ED5F92 3px solid;
    padding: 3%;
    border-radius: 5px;
    background: #F9F9EA;
    position: relative;
    line-height: 1.6;
    margin-bottom: 3%;
}
.point_list li:before{
	position: absolute;
    top: -17px;
    background: #CB064B;
    padding: 0 15px;
    border-radius: 20px;
    left: 0;
    right: 0;
    width: 70px;
    margin: auto;
    color: #fff;
    text-align: center;
}
.point_list li.p01:before{
	content:"Point１";
}
.point_list li.p02:before{
	content:"Point２";
}
.ttlArea{
	background:url(../images/bg_ttlArea.jpg) center no-repeat;
	background-size: cover;
	text-align: center;
	padding: 5% 0;
}
.outline .ttlArea{
	background:url(../images/bg_ttlArea_outline.jpg) center no-repeat;
	background-size: cover;
}
.ttlArea h2{
    font-size: 3.5rem;
    font-weight: bold;
    color: #fff;
    line-height: 1.3;
}
#methodArea{
    padding-top: 0;
}
#methodArea > .inner{
    padding-top: 50px;
}

@media(max-width: 1099px) {
    .inner {padding: 3%;}
    .outline_set .box h3, .outline_set dd h3{font-size: 3.8vw;}
    .outline_set .box h4, .outline_set dd h4{font-size: 3vw;}
    #topvisual {min-height: inherit;}
    .main_visual{padding: 2em 2.5%;}
    #topvisual h1{font-size: 7vw;}
    .outline_set dt{font-size: 4vw;}
    .outline_set .bg_white{width: 96%;}
    .outline_list li:nth-of-type(2) .inner{padding: 0 2%;}
    #methodArea{padding: 0;}
}
@media(max-width: 799px) {
    .outline_list .flow_list{width: 20%;}
    .outline_list .detailArea{width: 78%;}
    .ttlArea h2{font-size: 6vw;}
    .ttlArea h3{font-size: 4.25vw;}
    .charm_list{margin-bottom: 0;}
    .main_visual{padding: 3em 0;}
    #information.new .lead{text-align: left;}
}
@media(max-width:599px) {
    .top_curriculum_list > li:first-of-type, .top_curriculum_list > li:nth-of-type(2), .outline_list .flow_list, .outline_list .detailArea, .outline_list .detailArea .point_list li{width: 100%;}
    .outline_list .flow_list li{width: 30%;padding: .25em;font-size: 90%;}
    .outline_list .flow_list li:not(:last-of-type){margin-bottom: 0;}
    .outline_list .flow_list li .dib{display: block;}
    .outline_list .flow_list{margin-bottom: 4%;display: flex;justify-content: space-between;}
    .outline_set dt, .ttlArea dt{font-size: 4.5vw;}
    .outline_set dt{margin-bottom:3%;}
    .detailArea .point_list li:first-of-type{margin-bottom: 30px;}
    .outline_list .flow_list li:not(:last-of-type):after{top: 0.35em;bottom: inherit;left: inherit;right: -15px; transform:rotate(-90deg);font-size: 150%;}
    .ttlArea h2{font-size:6vw;}
    .outline_set .box h3, .outline_set dd h3{font-size:4.8vw;}
    .outline_set .box h4, .outline_set dd h4, .ttlArea h3{font-size: 4.5vw;}
    .top_curriculum_list li > dl > dt{padding: 0.5em 0.2em;font-size: clamp(16px, 4vw, 24px);line-height: 1.4;}
    .course_contents dd{font-size: 100%;padding: 0.5em 0.5em 0.5em 3em;}
    .course_contents .basic dt, .course_contents .standard dt{line-height: 1;}
    .course_contents dd .icon{height: 2em;}
    .outline_set .bg_white.inner, .bg_white, .outline_list .box{padding: 3.5%;}
    .cta_btns ul > li .btn{letter-spacing: 1px;padding: 0.75em 0.5em;font-size: 16px;}
}
@media(max-width:399px) {
    .ttlArea h2{font-size:7vw;}
    .outline_set .box h3, .outline_set dd h3{font-size:6vw;}
    .outline_set .box h4, .outline_set dd h4, .ttlArea h3{font-size: 5.5vw;}
    .point_list li{padding: 4%;}
    .outline_set dt{font-size: 5.5vw;}
    .outline_set .inner{width: 94%;padding: 0;}
    .outline_set .inner{padding: 0;}
    #topvisual h1{font-size: 8vw;}
    .main_visual{padding:2em 0;}
}



#topvisual{
    display: block;
}
#topvisual h1{
    padding-top: 3%;
    text-shadow: 0 0 0.05em #222, 0 0 0.5em #222;
}
.small{
    font-size: 50%;
    display: block;
    background:#f5a500;
    color: #fff;
    border-radius: 30px;
    text-shadow:none;
    max-width: 20em;
    margin:0.25em auto 0;
}
#topvisual h1 .lss{
	letter-spacing: -0.25em;
}
#topvisual ul{
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    margin: 0 auto;
    top:inherit;
    left: 0;
    right: 0;
    width: 94vw;
    bottom: 10%;
}
#topvisual ul li, #topvisual ul li:first-of-type, #topvisual ul li:last-of-type{
	width: 24%;
}
#topvisual ul li:last-of-type{
    top: 0;
}
#topvisual ul li{
    position: relative;
}
.main_visual, #topvisual .main_visual{
    position: static;
}
#topvisual ul li:after {
    content: "";
    border: 1px #fff solid;
    width: 100%;
    height: 100%;
    display: block;
    position: absolute;
    top: 2px;
    left: 2px;
}

.top_curriculum .imgArea{
	max-width: 800px;
    margin: 0 auto;
    width: 80%;
}

.outline.boki .ttlArea{
	background: url(../images/bg_ttl_boki.jpg) center no-repeat;
    background-size: cover;
}
.outline.boki .outline_set .imgArea{
    width:40%;
    position: relative;
}
.outline.boki .outline_set .txtArea{
    width:57%;
}
.outline.boki .outline_set .txtArea dt{
	background: none;
    color:#f08300;
    text-align: left;
    line-height: 1.4;
    padding: 0;
    margin-bottom: 0.5em;
    font-size: 2rem;
}
.outline.boki .outline_set .flex{
	align-items: center;
	margin: 3%;
}
.outline_set dd h3{
    margin-bottom: 3%;
}
.outline_set .box h4{
    text-align: left;
    font-size: 1.7rem;
    line-height: 1.3;
    color: #565656;
    width: calc(100% - 200px);
	display: flex;
    align-items: center;
    font-weight: 600;
}
.outline_set .box .boxCatch{
	left: 0;
    background: #f08300;
    color: #fff;
    font-size:1.25rem;
    width: 180px;
    padding: 0.5em;
    line-height: 1.5;
    font-weight: 600;
	display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    min-height: 80px;
}
.outline_set .box .subttlArea{
	display: flex;
    justify-content: space-between;
    margin-bottom: 1em;
}
.outline_set .box h5{
    text-align: center;
    font-size: 1.5rem;
    margin-bottom: 5%;
    font-weight: 600;
    color: #1a7ec3;
}

.flowSet{

}
.flowSet li{
    width: 31%;
    background: #f9f3cf;
    position: relative;
}
.flowSet li dt{
    text-align: left;
    font-size: 1.4rem;
    line-height: 1.75;
    padding: 0.25em 0.25em 0.25em 0.5em;
    margin-bottom:0px;
}
.flowSet li dd{
    padding: 10px;
    line-height: 1.5;
}
.flowSet li .circle{
    position: absolute;
    right: -10px;
    top: -30px;
    line-height: 1.35;
    text-align: center;
    background: #CB064B;
    border-radius: 50%;
    height: 90px;
    width: 100px;
    color: #fff;
    padding-top: 18px;
    font-size: 14px;
    font-weight: 500;
}
.outline.boki .outline_set .flowSet.flex{
    margin: 3% 0;
    align-items: stretch;
}
.flowSet .red{
	color: #CB064B;
    font-weight: 600;
}
.flowSet li:not(:first-of-type):before{
	position: absolute;
    margin-right: 0.3em;
    font-family: "FAsolid";
    content:"\f061";
    font-weight: 600;
	color: #f08300;
	left: -10%;
    font-size: 2rem;
    top: 25%;
}
.flowSet li:first-of-type p{
	position: absolute;
    width: 205%;
    background: #f99763;
    text-align: center;
    color: #fff;
    z-index: 9;
    border-radius: 20px;
    font-weight: bold;
    font-size: 110%;
    bottom: 10px;
    padding: 0.25em;
}
.flowSet li:first-of-type p br{
	display: none;
}
.flowSet li:last-of-type p{
    text-align: center;
    background:#1a7ec3;
    color: #fff;
    border-radius: 20px;
    font-weight: bold;
    font-size: 110%;
    margin-top: 10px;
    padding: 0.25em;
}
.outline.boki .outline_set .flex.skipSet{
    align-items: start;
    margin: 0;
}
.outline.boki .outline_set .flex.skipSet li{
    width: 48%;
    margin:0 0 3% 0;
    align-items: center;
}
.outline.boki .outline_set .skipSet dt{
    background: none;
    color: #111;
    text-align: left;
    font-size: 1.25rem;
    margin-bottom: 0;
    padding: 0;
}
.outline.boki .outline_set .skipSet dl{
    width: 57%;
}
.outline.boki .outline_set .skipSet dd{
    line-height: 1.4;
}
.outline_set .box h3{
	color:#f08300;
}
.outline.boki .outline_set .imgArea p{
	font-size: 13px;
    width: 45%;
    line-height: 1.5;
    position: absolute;
    bottom: 0;
}
.outline.boki .outline_set .b02 .imgArea{
	width: 100%;
    max-width: 750px;
    margin: 0 auto 3%;
}
.txtSmall{
	font-size: 90%;
	vertical-align: text-top;
}
.outline.office .ttlArea{
	font-size: 3rem;
}
.outline_list .box h6, .oattl li{
	font-size: 1.5rem;
    text-align: center;
    font-weight: 600;
    background: #f99763;
    color: #fff;
    padding: 0 0.5em;
    position: relative;
}
.oattl.flex{
	justify-content: center;
	gap: 3em;
}
.oattl li:first-of-type:after{
	font-family: "FAsolid";
    content:"\f00d";
    font-weight: 600;
	color:#f08300;
    font-size: 2.5rem;
    position: absolute;
    right: -11.5%;
    top: -30%;
}
.office .outline_set .imgArea{
    max-width: 800px;
    margin: 5% auto;
}
.outline_set dd h3.oattl{
    font-size: 1.7rem;
    margin-bottom: 0;
}
.outline.office .outline_list {
	margin-bottom: 5%;
}
.step_list li{
    flex-direction: row-reverse;
    align-items: center;
    justify-content: space-between;
}
.step_list li h3 {
    font-size: 1.7rem;
    background: #006cb8;
    color: #fff;
    margin-bottom: 0.75em;
    padding: 0.25em 0.5em;
    line-height: 1.4;
    font-weight: 500;
}
.step {
    padding-right: 0.5em;
    border-right: 1px #fff solid;
    margin-right: 0.5em;
    font-weight: bold;
    color: #fff462;
}
.step_list li:not(:last-of-type) {
    margin-bottom: 3em;
}
.step_list .img_area {
    width: 30%;
}
.step_list .txt_area {
    width: 65%;
}
.step_list p{
    text-align: left;
    font-size: 16px;
    font-weight: normal;
}
.step_list li:first-of-type img{
    border: 1px #ccc solid;
}
#job .ttlArea{
	background: url(../images/bg_ttl_osusume.jpg) center no-repeat;
    background-size: cover;
    margin-bottom: 3%;
}
.inner.jobList{
    width: 94vw;
    max-width: 1600px;
}
.jobList .charm_list dd .txt_area{
	width: 100%;
}
.jobList .charm_list dd .img_area{
	width: 80%;
    margin: 0 auto;
}
.workList.flex{
    width: 85%;
    margin: 0 auto; 
}
.workList.flex li{
	width: calc(100% / 6);
}
.charm_list dt{
    font-size: clamp(18px, 1.25vw, 24px);
}
#whatArea{
    background: #FFF7EA;
}
#whatArea .toggle_txt{
    padding:50px 0 0;
    background: none;
}
#whatArea .secttl{
	border-top: #f08300 3px solid;
    border-bottom: #f08300 3px solid;
}
.charm_list dt{
    border-bottom: 2px #f08300 solid;
    background: #FFF7EA;
}
#methodArea > .inner, #charmArea > .inner, #whatArea > .inner, .inner.jobList{
	max-width: 1100px;
}
.boki_office .secttl:after{
    background: #f08300;
}
.top_curriculum h2{
    color: #f08300;
    text-align: center;
    font-size: 2.5rem;
    font-weight: bold;
    line-height: 1.5;
    margin-bottom: 2%;
}
.top_curriculum p{
    font-size: 20px;
}
.ttlArea h2 .lss{
	letter-spacing: -0.25em;
}
@media (max-width: 1399px) {
    .charm_list li {width: calc(100% / 3 - 3vw);}
    .charm_list li:not(:last-of-type), .charm_list li{margin-bottom:5%;margin-top: 0;}
    
}
@media (max-width: 1099px) {
    #topvisual{min-height: 400px;}
    #topvisual h1{font-size: 5.5vw;}
    .oattl li:first-of-type:after{right: -10%;}
	#methodArea > .inner, .inner.jobList{width: 100%;}
	.outline_list li:nth-of-type(2) .inner{padding: 2%;}
}
@media (max-width: 999px) {
	.charm_list dd{align-items: unset;}
	#methodArea .charm_list dd .img_area, #methodArea .charm_list dd .txt_area{width: 100%;}
	#methodArea .charm_list dd .img_area, #whatArea .charm_list dd .img_area{height: 18vw;overflow: hidden;}
	#whatArea .charm_list li {margin-bottom: 5%;}
    #topvisual{min-height: 300px;}
    .outline.boki .outline_set .imgArea{margin-bottom: 5%;}
    .outline.boki .outline_set .imgArea p{bottom: -2em;}
    .flowSet li:last-of-type p, .flowSet li:first-of-type p{font-size: 100%;}
}
@media (max-width: 799px) {
	#topvisual h1{padding-top: 0;}
	#topvisual ul li, #topvisual ul li:first-of-type, #topvisual ul li:last-of-type{width: 49%;margin-bottom: 1.5%;}
	#topvisual ul{bottom: 5%;}
	.main_visual{padding: 1.5em 0;}
	.ttlArea h2{font-size: 7vw;}
	.outline_set dt{font-size: 3.5vw;}
	.outline_set .box .boxCatch{font-size: 2.25vw; width: 22%;}
	.outline_set .box h4{width: 75%;font-size: 3.5vw;}
	.outline_set .box h5{font-size: 1.25rem;}
	.outline.boki .outline_set .txtArea dt{font-size: 3.5vw;}
	.outline_list .box h6, .oattl li{line-height: 1.4;padding: 0.25em; font-size: 3vw;}
	.oattl li:first-of-type:after{right: 0;left: 0;top: 4.5vw;}
	.outline_set dd h3.oattl{font-size: 3vw;}
	.office .outline_set .imgArea{margin: 2% auto;}
	.step_list li h3{font-size: 2.75vw;}
	.charm_list li{width: 100%;}
	#methodArea .charm_list dd .img_area, .jobList .charm_list dd .img_area, #whatArea .charm_list dd .img_area{width: 35%;}
	#methodArea .charm_list dd .img_area, #whatArea .charm_list dd .img_area{height:20vw;}
	#methodArea .charm_list dd .txt_area, .jobList .charm_list dd .txt_area, #whatArea .charm_list dd .txt_area{width: 62%;}
	.outline.boki .outline_set .skipSet dt{font-size: 1.1rem;line-height: 1.5;}
	.outline_set .box .boxCatch{min-height: 60px;}
	.outline_set .box .boxCatch br{display:none;}
	.oattl.flex{gap: 5vw;}
	.b02 .imgArea{padding-top: 0;background: none;}
	.outline.boki .outline_set .imgArea, .outline.boki .outline_set .txtArea, .outline.boki .outline_set .skipSet dl, .outline.boki .outline_set .b03 .imgArea{width:100%;}
	.outline.boki .outline_set .imgArea p{bottom: 5vw;}
	.outline.boki .outline_list li:first-of-type .outline_set .txtArea{width: 62%;}
	.outline.boki .outline_list li:first-of-type .outline_set .imgArea{width: 35%;}
	.flowSet li .circle{height: 85px;width: 90px;right: -12px;font-size: 13px;top: -20px;}
	.outline.boki .outline_set .flowSet.flex{max-width: 400px;margin: 0 auto 5%;width:90%;padding-left: 20px;}
	.flowSet li{width: 100%;}
	.flowSet li:not(:last-of-type){margin-bottom: 25px;}
	.flowSet li:not(:first-of-type):before{content: "\f063";left:0;right: 0;bottom: 0;top:-45px;margin: 0 auto;text-align: center;}
	.flowSet li:first-of-type p{width: 2em;height: 225px;left: -35px;top: 0;font-size: 15px;padding-top: 10px;}
	.flowSet li:first-of-type p br{display:block;}
	.top_curriculum h2{font-size: 4vw;}
	.top_curriculum p{font-size: 14px;}
}
@media (max-width: 699px) {
	#topvisual ul li{padding: 1vw;font-size: 3vw;}
	#topvisual{background: url(../images/bg_h1_smt.jpg) center no-repeat;background-size: cover;}
	#topvisual ul li{font-size: 4.3vw;}
	.main_visual, #topvisual .main_visual{padding-top: 39vw;}
	#topvisual h1{font-size: 8.5vw;}
	#topvisual{height: 120vw;}
	#topvisual ul li{background: rgba(255, 255, 255, 0.9);}
	#topvisual ul li:after{content:inherit;}
	#topvisual ul{bottom: 3%;}
}
@media (max-width: 599px) {
	.step_list .img_area {width: 80%;margin: 1em auto 0;}
	.step_list .txt_area {width: 100%;}
	.outline.boki .outline_set .flex.skipSet li{width: 100%;margin-bottom: 1.25em;}
	.outline.boki .outline_set .flex.skipSet .imgArea{width:80%;margin:0 auto 0.5em;}
	.outline.boki .outline_set .skipSet dl{width: 100%;}
	.outline.boki .outline_set .skipSet dt{font-size: 1.05rem;}
	.outline_set .box .subttlArea{flex-wrap: wrap;}
	.outline_set .box .boxCatch, .outline_set .box h4{width: 100%;}
	.outline_set .box .boxCatch{min-height: auto;font-size:1rem;margin-bottom: 0.5em;font-weight: 600;}
	.outline_set .box h4{font-size: 1.15rem;display: block;}
	.outline_set .box h5{line-height: 1.4;font-size: 1.05rem;}
	.outline.boki .outline_set .skipSet .imgArea{margin-bottom: 0;}
	/*.outline.boki .outline_set .b03 .imgArea{margin-bottom: 12%;}*/
	.outline.boki .outline_set .imgArea p{bottom: -2em;}
	.ttlArea h2{font-size:8vw;}
	.step_list li h3{font-size: 4.25vw;}
	.outline.boki .outline_set .txtArea dt{font-size: 5vw;}
	.supportArea .charm_list dd .txt_area, #methodArea .charm_list dd .txt_area, .jobList .charm_list dd .txt_area, #whatArea .charm_list dd .txt_area{width:100%;}
	.jobList .charm_list dd .img_area{width: 50%;}
	#whatArea .charm_list dd .img_area{overflow: hidden;}
	#methodArea .charm_list dd .img_area, #whatArea .charm_list dd .img_area{width: 100%;height: 50vw;}
	.outline_set dt{font-size: 4.5vw;}
	.outline_list .box h6, .oattl li{font-size: 4.5vw;}
	.outline_set dt{font-size: 4.3vw;}
	.oattl li:first-of-type:after{top: 6.3vw;font-size: 7vw;}
	.charm_list dd{display: block;}
	#methodArea .charm_list dd .img_area, .jobList .charm_list dd .img_area, #whatArea .charm_list dd .img_area{margin-bottom: 1em;}
	.top_curriculum h2{font-size: 5vw;}
	.inner{padding: 5% 3%;}
}
@media (max-width: 399px) {
	.outline.boki .outline_list li:first-of-type .outline_set .txtArea{width:100%;}
	.outline.boki .outline_list li:first-of-type .outline_set .imgArea{width: 40%;margin: 0 auto 1em;}
	.outline.boki .outline_list li:first-of-type .outline_set .txtArea dt{font-size: 5vw;text-align: center;}
	.outline_list li:nth-of-type(2) .inner{padding: 0;}
}

