@charset "utf-8";

/*========================

course.css

========================*/

#front_menu dl.menu dd ul li a {
 justify-content:start;
 padding:20px 15px 20px 25px;
}

#main_cont .section.pattern_a {
 margin-top:20px;
 position:relative;
}

#main_cont .section.pattern_a .section_title {
 /*align-items:start;*/
 justify-content:start;
 padding: 20px 0 25px 20px;
 position:relative;
 z-index:6;
}

#main_cont .section.pattern_a .section_title:after {
 background-image:url(../img/common/i_figure_a.webp);
 background-position:center center;
 background-size:120px 150px;
 background-repeat:no-repeat;
 bottom:0;
 content:" ";
 height:150px;
 position:absolute;
 right:30px;
 width:120px;
 z-index:6;
}

#course #course_cont {
background-color:var(--blue03);
border-radius:0 0 10px 10px;
display:flex;
flex-direction:column;
padding:15px;
}

#course #course_cont #course_menu {
column-gap:15px;
display:flex;
flex-wrap:wrap;
justify-content:space-between;
row-gap:15px;
}

#course #course_cont #course_menu .menu {
background-color:var(--white);
border-radius:10px;
box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.2);
display:flex;
flex:1 1 30%;
max-width:calc(100% / 3 - 15px);
}

#course #course_cont #course_menu .menu a {
display:flex;
padding:15px 15px 0;
width:100%;
}

#course #course_cont #course_menu .menu a:hover {
background-color:var(--light_yellow);
border-radius:10px;
}

#course #course_cont #course_menu .menu a dl {
width:100%;
}

#course #course_cont #course_menu .menu a dl dt {
height:140px;
overflow: hidden;
}

@media screen and (min-width:1680px) {
#course #course_cont #course_menu .menu a dl dt img {
height:180px;
}
}

#course #course_cont #course_menu .menu a dl dt img {
height:140px;
object-fit:cover;
opacity:0;
-webkit-transition:opacity 3s, transform 0.35s ease-in-out;
transition: opacity 3s, transform 0.35s ease-in-out;
width:100%;
}

#course #course_cont #course_menu .menu a dl dt img.lazyloaded {
opacity:1;
}

#course #course_cont #course_menu .menu a:hover dl dt img {
transform:scale(1.15) rotate(2deg);
}

#course #course_cont #course_menu .menu a dl dd {

}

#course #course_cont #course_menu .menu a dl dd h3 {
align-items:center;
display:flex;
justify-content:space-between;
padding:15px 0;
position:relative;
width:100%;
}

#course #course_cont #course_menu .menu a dl dd h3:after {
content:"\f054";
color:var(--gray_cc);
font-family:var(--icon);
font-size:1.3rem;
font-weight:600;
right:0;
top:50%;
margin-top:-7px;
opacity:1;
position:absolute;
z-index:3;
}

#course #course_cont #course_menu .menu a dl dd h3 span {
 display:flex;
 font-weight:600;
 font-size: calc(0.8rem + ((1vw - 0.48rem) * 0.6944));
 overflow: hidden;
 display: -webkit-box;
 text-overflow: ellipsis;
 -webkit-box-orient: vertical;
 -webkit-line-clamp:1;
 line-height:1.2;
}

/*---------------------------------------------
course_detail
---------------------------------------------*/
.course_detail {
	display:flex;
	flex-direction:column;
 position:relative;
 row-gap:20px;
}

.course_detail .course_detail_head {
	background-color:var(--white);
	border-radius:6px 6px 0 0;
	display:flex;
	flex:1;
	flex-direction:column;
	gap:10px;
	padding:25px 25px;
	width:100%;
}

.course_detail .course_detail_head p {
	font-size:1.4rem;
	line-height:1.8;
}

.course_detail .course_detail_cont {
	display:flex;
	flex:1;
	flex-direction:column;
	gap:20px;
}

/*--- course_conversion ---*/
.course_conversion {
 align-items:center;
 display:flex;
	flex-direction:column;
 row-gap:10px;
 padding:25px 280px 20px 15px;
 border:1px solid var(--gray_dd);
 border-radius:10px;
}

.course_conversion dl.tel {
	display:flex;
	flex-direction:column;
	row-gap:10px;
}

.course_conversion dl.tel dt {
	align-items:center;
	display:flex;
	justify-content:center;
}

.course_conversion dl.tel dd {
	align-items:center;
	display:flex;
	justify-content:center;
}

.course_conversion dl.tel dd a {
	align-items:center;
	display:flex;
	gap:5px;
	justify-content:start;
}

.course_conversion dl.tel dd a img {
	width:22px;
	height:22px;
}

.course_conversion dl.tel dd a span {
	color:var(--blue);
	font-family:arial,helvetica,roboto;
	font-size:3.2rem;
	font-weight:600;
}

.course_conversion .accept_hour {
	align-items:center;
	column-gap:10px; 
	display:flex;
	justify-content:center;
	row-gap:10px;
}

.course_conversion .accept_hour p {
	font-size: 1.3rem;
	font-weight:600;
	text-align:center;
}

.course_conversion .accept_hour ul {
	align-items:center;
 column-gap:15px;
 display:flex;
	justify-content:center;
	row-gap:10px;
}

.course_conversion .accept_hour ul li {

}

.course_conversion .accept_hour ul li dl {
	align-items:center;
	column-gap:5px;
	display:flex;
	justify-content:start;
}

.course_conversion .accept_hour ul li dl dt {
	font-size: 1.2rem;
	flex: 0 1 80px;
	padding:3px;
	white-space: nowrap;
	min-width:50px;
}

.course_conversion .accept_hour ul li dl dd {
	letter-spacing:-0.03em;
	white-space: nowrap;
}

.course_conversion .accept_hour ul li dl dd span:first-child {
	font-size: 1.6rem;
	font-family: Arial;
	font-weight:600;
	letter-spacing:-0.01em;
}

.course_conversion .accept_hour ul li dl dd span:nth-child(2) {
	font-size: 1.2rem;
	letter-spacing:-0.03em;
}

.course_conversion .accept_hour ul li.weekdays dl dt {
	background-color:var(--blue01);
	color:var(--deepblue);
	text-align:center;
}

.course_conversion .accept_hour ul li.sat_sun_hol dl dt {
	background-color:var(--light_red);
	color:var(--red);
	text-align:center;
}

figure.image {
	position:absolute;
	aspect-ratio:1 / 1;
	right:30px;
	bottom:40px;
}

figure.image img {
	height:100%;
	width:100%;
	max-width:240px;
}

/*--- time_place ---*/
.course_detail .course_detail_cont .time_place {
 align-items:center;
 display:flex;
	flex-direction:column;
	justify-content:center;
	row-gap:30px;
}

.course_detail .course_detail_cont .time_place h4 {
 align-items: center;
 background-color: var(--deepblue);
 border-radius: 30px;
 color: var(--white);
 flex: 0 1 auto;
 flex-grow: 0;
 font-size: calc(1.3rem + ((1vw - 0.48rem) * 0.6944));
 font-weight: 600;
 padding: 15px 20px;
 max-width: 100%;
 text-align: center;
 width:100%;
}

.course_detail .course_detail_cont .time_place h5 {
 font-weight: 600;
 font-size: calc(1.3rem + ((1vw - 0.48rem) * 0.6944));
}

.course_detail .course_detail_cont .time_place h5 span {
 color: var(--orange);
}

.course_detail .course_detail_cont .time_place ul {
 background-color: var(--blue01);
 column-gap:15px;
 padding:15px;
 border-radius:10px;
 display:flex;
	justify-content:space-between;
 width:100%;
}

.course_detail .course_detail_cont .time_place ul li {
 align-items:center;
 background-color: var(--white);
 border-radius: 10px;
 display:flex;
	flex-direction:column;
	justify-content:center;
 padding:12px 15px 25px;
 row-gap:10px;
 width:calc(100% / 2 - 10px);
}

.course_detail .course_detail_cont .time_place ul li dl {
 align-items:center;
 display:flex;
	flex-direction:column;
 flex:1;
	justify-content:center;
	row-gap:10px;
}

.course_detail .course_detail_cont .time_place ul li dl dt {
 align-items:center;
 column-gap:20px;
 display:flex;
 flex:1;
 flex-direction:column;
	justify-content:start;
 row-gap:0;
}

.course_detail .course_detail_cont .time_place ul li dl dt span {
 align-items:center;
 display:flex;
 font-size: calc(1.1rem + ((1vw - 0.48rem) * 0.6944));
 font-weight:600;
 flex:1;
}

.course_detail .course_detail_cont .time_place ul li dl dt img {
 height:100px;
 width:auto;
}

.course_detail .course_detail_cont .time_place ul li dl dd {
 font-size: calc(0.8rem + ((1vw - 0.48rem) * 0.6944));
 line-height:1.4;
 text-align:center;
}

.course_detail .course_detail_cont .time_place ul li dl dd span {
 font-size: calc(1.1rem + ((1vw - 0.48rem) * 0.6944));
 font-weight:600;
}

/*--- nessesary ---*/
.course_detail .course_detail_cont .nessesary {
 align-items:center;
 display:flex;
	flex-direction:column;
	justify-content:center;
	row-gap:20px;
}

.course_detail .course_detail_cont .nessesary h4 {
 align-items: center;
 background-color: var(--deepblue);
 border-radius: 30px;
 color: var(--white);
 flex: 0 1 auto;
 flex-grow: 0;
 font-size: calc(1.3rem + ((1vw - 0.48rem) * 0.6944));
 font-weight: 600;
 padding: 15px 20px;
 max-width: 100%;
 text-align:center;
 width:100%;
}

.course_detail .course_detail_cont .nessesary ul {
 column-gap:15px;
 display:flex;
 flex-wrap:wrap;
 padding:0;
 row-gap:15px;
 width:100%;
}

.course_detail .course_detail_cont .nessesary ul li {
 border:1px solid var(--gray_dd);
 border-radius:6px;
 display:flex;
 flex-direction:column;
	justify-content:center;
 width:calc(100% / 3 - 10px);
}

.course_detail .course_detail_cont .nessesary ul li dl {
 align-items: center;
 display:flex;
 flex-direction:column;
	justify-content:center;
 padding:20px;
 row-gap:10px;
 flex:1;
}

.course_detail .course_detail_cont .nessesary ul li dl dt {
 align-items: center;
 display:flex;
	justify-content:center;
 height:60px;
}

.course_detail .course_detail_cont .nessesary ul li dl dt img{
 height:30px;
 width:auto;
}

.course_detail .course_detail_cont .nessesary ul li dl dd {
 align-items:center;
 display:flex;
	flex-direction:column;
	justify-content:start;
 font-size: calc(0.8rem + ((1vw - 0.48rem) * 0.6944));
 line-height:1.4;
 flex:1;
 row-gap:5px;
}

.course_detail .course_detail_cont .nessesary ul li.photo dl dt img {
 height:50px;
 width:auto; 
}

.course_detail .course_detail_cont .nessesary ul li.lisence_card dl dt img {
 height:40px;
 width:auto; 
}

.course_detail .course_detail_cont .nessesary ul li.sign dl dt img {
 height:35px;
 width:auto; 
}

.course_detail .course_detail_cont .nessesary ul li.certificate dl dt img {
 height:50px;
}

.course_detail .course_detail_cont .nessesary ul li.met_grove dl dt img {
 height:60px;
 width:auto; 
}

.course_detail .course_detail_cont .nessesary ul li.met_grove dl dd span.case_motor {
 color:#fff;
 background-color:#333;
 border-radius:15px;
 font-size: calc(0.7rem + ((1vw - 0.48rem) * 0.6944));
 padding:5px 10px;
}


/*--- target ---*/
.course_detail .course_detail_cont .target {
 align-items:center;
 display:flex;
	flex-direction:column;
	justify-content:center;
	row-gap:30px;
}

.course_detail .course_detail_cont .target h4 {
 align-items: center;
 background-color: var(--deepblue);
 border-radius: 30px;
 color: var(--white);
 flex: 0 1 auto;
 flex-grow: 0;
 font-size: calc(1.3rem + ((1vw - 0.48rem) * 0.6944));
 font-weight: 600;
 padding: 15px 20px;
 max-width: 100%;
 text-align:center;
 width:100%;
}

.course_detail .course_detail_cont .target dl {
 align-items:center;
 display:flex;
	flex-direction:column;
	justify-content:center;
	row-gap:30px;
 width:100%;
}

.course_detail .course_detail_cont .target dl dt {
 font-size: calc(1.3rem + ((1vw - 0.48rem) * 0.6944));
 font-weight:600;
}

.course_detail .course_detail_cont .target dl dt .accent {
 color: var(--orange); 
}

.course_detail .course_detail_cont .target dl dd {
 width:100%;
}

.course_detail .course_detail_cont .target dl dd ul {
 align-items:start;
 display:flex;
	flex-direction:column;
	justify-content:center;
	row-gap:15px;
 width:100%;
}

.course_detail .course_detail_cont .target dl dd ul li {
 font-size: calc(1.1rem + ((1vw - 0.48rem) * 0.6944));
 text-align:left;
 position:relative;
}

.course_detail .course_detail_cont .target dl dd ul li span {
 position:relative;
 z-index:2;
} 

.course_detail .course_detail_cont .target dl dd ul li:before {
 background-color: var(--light_yellow);
 content: " ";
 height:10px;
 position: absolute;
 bottom:-5px;
 width:100%;
 z-index:1;
}

.course_detail .course_detail_cont .target dl dd .note {
 align-items:start;
 display:flex;
	flex-direction:column;
	justify-content:center;
	row-gap:10px;
}

.course_detail .course_detail_cont .target dl dd .note p {
 font-size: calc(0.8rem + ((1vw - 0.48rem) * 0.6944)); 
 line-height:1.4;
}


.alert {
 display:flex;
 flex-direction:column;
 row-gap:10px;
}

.alert .alert_cont {
 background-color:var(--white);
 border-radius:6px;
 padding:25px;
}

.alert .alert_cont dl.osaka_fukei {
	align-items: center;
	background-color:var(--white);
	border-radius:6px;
	display:flex;
	flex-direction:column;
	justify-content:center;
	row-gap:20px;
}

.alert .alert_cont dl.osaka_fukei dt {
	color:var(--gray_33);
	display:flex;
	justify-content:center;
	font-weight:600;
	font-size: calc(1.0rem + ((1vw - 0.48rem) * 0.6944));
}

.alert .alert_cont dl.osaka_fukei dd {
	align-items:center;
	display:flex;
	flex-direction:column;
	justify-content:center;
	row-gap:10px;
}

/*---------------------------------------------
senior
---------------------------------------------*/
#main_cont .section#ancSenior.pattern_a {
 /*background: #c5b3d7;*/
 margin-top:0;
}

#main_cont .section#ancSenior.pattern_a .section_title {
 /*background: rgba(78,35,116,1.0);*/
}

#main_cont .section#ancSenior.pattern_a .section_title > span {
 /*color:#ede9f1;*/
}

#main_cont .section#ancSenior.pattern_a .section_title:after {
 background-image: url(../img/course/p_course_senior_b.webp);
 background-position: center center;
 background-size: contain;
 background-repeat: no-repeat;
 aspect-ratio:22 /21;
 content: " ";
 height: auto;
 position: absolute;
 right:10px;
 top:-30px;
 width:220px;
 z-index: 6;
}

#main_cont .section.pattern_a#ancSenior .box .section_cont {
 row-gap:30px;
}

#main_cont .section#ancSenior .course_detail .course_detail_cont h5 {
 font-weight: 600;
 font-size: calc(1.3rem + ((1vw - 0.48rem) * 0.6944));
 line-height:1.4;
}

#main_cont .section#ancSenior .course_detail .course_detail_cont p {
 font-size: calc(0.8rem + ((1vw - 0.48rem) * 0.6944));
 line-height:1.4;
}

#main_cont .section#ancSenior .course_conversion dl.tel dt.exclusive {
	align-items:center;
	background:rgba(78,35,116,1.0);
	border-radius:20px;
	color:#fff;
	display:flex;
	flex:1;
	flex-direction:column;
	font-size:1.4rem;
	justify-content:center;
	gap:10px;
	padding:9px 15px 8px;
	position:relative;
}

#main_cont .section#ancSenior .course_conversion dl.tel dt.exclusive:after {
	background:rgba(78,35,116,1.0);
	height: calc(tan(60deg) * 20px / 2);
	content:" ";
	width: 20px;
	clip-path: polygon(0 0, 100% 0, 50% 100%);
	position:absolute;
	bottom:-10px;
	left:50%;
	margin-left:-10px;
}

#main_cont .section#ancSenior .course_conversion dl.tel dd a span {
	color:#4e2374;
}

#main_cont .section#ancSenior figure.image {
	right:20px;
	bottom:10px;
}

/*---------------------------------------------
beginner
---------------------------------------------*/
#main_cont .section#ancBeginner {
 margin-top:0;
}

#main_cont .section#ancBeginner .section_title:after {
 background-image: url(../img/course/p_course_beginner_b.webp);
 background-position: center center;
 background-size: contain;
 background-repeat: no-repeat;
 aspect-ratio:22 /21;
 content: " ";
 height: auto;
 position: absolute;
 right:10px;
 top:-40px;
 width:220px;
 z-index: 6;
}

#main_cont .section.pattern_a#ancBeginner .box .section_cont {
 row-gap:30px;
}

#main_cont .section#ancBeginner .course_detail .course_detail_cont {
	padding:0;
 row-gap:30px;
}

#main_cont .section#ancBeginner figure.image {
 right:50px;
}

/*---------------------------------------------
learning
---------------------------------------------*/
#main_cont .section#ancLearning.pattern_a {
 margin-top:0;
}

#main_cont .section#ancLearning.pattern_a .section_title:after {
 background-image: url(../img/course/p_course_learning_b.webp);
 background-position: center center;
 background-size: contain;
 background-repeat: no-repeat;
 aspect-ratio:22 /21;
 content: " ";
 height: auto;
 position: absolute;
 right:10px;
 top:-40px;
 width:220px;
 z-index: 6;
}

#main_cont .section#ancLearning.pattern_a .course_detail .course_detail_cont {
	padding:0;
 row-gap:30px;
}

#main_cont .section#ancLearning.pattern_a figure.image {
 right:50px;
 bottom:50px; 
}

/*---------------------------------------------
offender
---------------------------------------------*/

#main_cont .section#ancOffender.pattern_a {
 margin-top:0;
}

#main_cont .section#ancOffender.pattern_a .section_title:after {
 background-image: url(../img/course/p_course_offender_b.webp);
 background-position: center center;
 background-size: contain;
 background-repeat: no-repeat;
 aspect-ratio:22 /21;
 content: " ";
 height: auto;
 position: absolute;
 right:10px;
 top:-40px;
 width:220px;
 z-index: 6;
}

#main_cont .section#ancOffender.pattern_a .section_cont {
 row-gap:30px;
}

#main_cont .section#ancOffender.pattern_a .course_detail .course_detail_cont {
	padding:0;
 row-gap:30px;
}

#main_cont .section#ancOffender figure.image {
 right:50px;
}

#main_cont .section#ancOffender .course_conversion {
 padding:25px 280px 20px 25px
}

#main_cont .section#ancOffender .course_conversion p {
 color:#cc6633;
 font-size: calc(1.0rem + ((1vw - 0.48rem) * 0.6944));
 font-weight:600;
 line-height:1.4;
}