@charset "UTF-8";
.sec-sub-mv{
    background:url(../../img/course/bg_mv.png) no-repeat;
    background-size: cover;
    background-position: bottom;
}
@media (max-width: 768px){
    .sec-sub-mv{
        background:url(../../img/course/bg_mv_sp.png) no-repeat;
        background-size: cover;
        background-position: bottom;
    }
}
.sec-ttl-en{
	font-size:5rem
}
@media (max-width: 768px){
	.sec-ttl-en{
		font-size:8vw
	}
}
/*---------- anchor-link ----------*/
.anchor-link{
    display: flex;
    justify-content: space-between;
    gap:5%;
    width:100%;
    max-width:800px;
    margin:40px auto 0;
}
.anchor-link-btn{
    text-align: center;
    flex: 0 1 auto;
    display: flex;
    flex-direction: column;
    width:50%;
}
.anchor-link-btn p{
    font-size: 1.4rem;
    margin-bottom:10px;
    font-family: "Zen Maru Gothic", sans-serif;
    font-weight: 500;
}
.anchor-link-btn a{
    flex: 1;
    font-family: "Zen Maru Gothic", sans-serif;
    font-weight: 700;;
    padding:20px;
    background: #fff;
    border:2px solid #CF001C;
    font-size: 1.8rem;
    position: relative;
    line-height: 1.4;
    color:#CF001C;
    border-radius:15px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.anchor-link-btn a::after{
    content:'';
    position: absolute;
    display: block;
    background: url(../../img/common/icon_arrow_en_r.svg) no-repeat;
    background-size: 100%;
    width:30px;
    height:30px;
    top:0;
    bottom:0;
    margin:auto;
    right:20px;
    transform: rotate(90deg);
}
@media (max-width: 1080px){
    .anchor-link-btn a[href="#course-01"] {
        padding-right:5vw;
    }
}
@media (max-width: 768px){
    .anchor-link{
        flex-direction: column;
        gap:0;
        max-width:initial;
        margin:7vw auto 0;
    }
    .anchor-link-btn{
        width:100%;
    }
    .anchor-link-btn+.anchor-link-btn{
        margin-top:5vw;
    }
    .anchor-link-btn p{
        font-size: 3.7vw;
        margin-bottom:2vw;
    }
    .anchor-link-btn a{
        padding:4vw;
        font-size: 3.9vw;
        border-radius:2.143vw;
        width:90%;
        margin:0 auto;
    }
    .anchor-link-btn a::after{
        width:4.286vw;
        height:4.286vw;
        right:3vw;
    }
}



/*---------- course ----------*/
#course-01,
#course-02,
#option{
    padding:100px 0
}
.sec-ttl-ja{
	margin-top: 0
}
.sec-ttl-ja-sub{
	display: block;
	margin-top: 30px;
	font-size:2.0rem;
	font-weight: 500	
}
.sec-ttl-ja-sub sup{
	font-size:0.6em
}
.sec-ttl-ja .couse-no{
	text-align: center;
	background: #1A2C61;
	color:#fff;
	padding: 0.2em 0.5em;
	margin-right: 10px;
	border-radius: 5px;
	font-weight: 700;
	font-size:1.3rem;
	line-height: 1
}
.sec-ttl-ja .couse-no .num{
	font-size:2.4rem;
	
}

.course-tag{
    display: flex;
    align-items:center;
    flex-wrap: wrap;
    gap:20px;
}
.tag-txt-n{
    color:#1A2C61;
    border:2px solid #1A2C61;
    background: #fff;
    padding:0 30px;
    font-family: "Zen Maru Gothic", sans-serif;
    font-size:2.4rem;
    font-weight: 700;
    border-radius: 50px;
}
.tag-txt-b{
    color:#fff;
    border:2px solid #7196CA;
    background: #7196CA;
    padding:0 30px;
    font-family: "Zen Maru Gothic", sans-serif;
    font-size:2.4rem;
    font-weight: 700;
    border-radius: 50px;
}
.tag-txt-r{
    color:#fff;
    border:2px solid #CF001C;
    background: #CF001C;
    padding:0 30px;
    font-family: "Zen Maru Gothic", sans-serif;
    font-size:2.4rem;
    font-weight: 700;
    border-radius: 50px;
}
.tag-txt-plus{
	font-size:2.4rem;
    font-weight: 700;
}
.tag-icon{
    width:60px;
}
/* course-flow */
.sec-sub-ttl{
    margin-top:80px;
}
.course-flow{
    position: relative;
}
.course-flow::before{
    content:'';
    position: absolute;
    width:100px;
    height:1334px;
    background: #CF001C;
    left:20px;
    bottom: 94px;
    clip-path: polygon(
    28% 0%,      /* 左上 */
    72% 0%,    /* 右上 */
    72% 97%,   /* 右下 矢尻手前 */
    100% 97%,    /* 矢尻右角 */
    50% 100%,   /* 矢尻先端（中央） */
    0% 97%,    /* 矢尻左角 */
    28% 97%      /* 左下 矢尻手前 */
    );
}
.course-flow dl{
    display: flex;
    border-radius: 20px;
    overflow: hidden;
    position: relative;
    z-index: 1;
}
.course-flow dl+dl{
    margin-top:30px;
}
.course-flow dl dt{
    width:33%;
    padding:0 40px;
    font-family: "Zen Maru Gothic", sans-serif;
    font-size:2.4rem;
    font-weight: 700;
    display: flex;
    align-items: center;
}
.course-flow dl dt span{
    display: inline-block;
    white-space: nowrap;
}
.course-flow dl dt span.tag-r{
    display: inline-block;
    background: #CF001C;
    font-size:1.6rem;
    padding:0 20px;
    border-radius: 50px;
    color:#fff;
    margin-left:20px;
}
.course-flow dl dt span.tag-b{
    display: inline-block;
    background:#7196CA;
    font-size:1.6rem;
    padding:0 20px;
    border-radius: 50px;
    color:#fff;
    margin-left:20px;
}
.course-flow dl:nth-of-type(1){
    border:2px solid #F9EBE3;
}
.course-flow dl:nth-of-type(1) dt{
    background: #F9EBE3;
}
.course-flow dl:nth-of-type(2){
    border:2px solid #FFE3D2;
}
.course-flow dl:nth-of-type(2) dt{
    background: #FFE3D2;
}
.course-flow dl:nth-of-type(3){
    border:2px solid #FFD0B4;
}
.course-flow dl:nth-of-type(3) dt{
    background: #FFD0B4;
}
.course-flow dl:nth-of-type(4){
    border:2px solid #FFB68B;
}
.course-flow dl:nth-of-type(4) dt{
    background: #FFB68B;
}
.course-flow dl dd{
    width:67%;
    padding:20px 40px 20px 30px;
    background: #fff;
    display: flex;
    align-items: center;
}
.course-time{
    background: #EB9144;
    border-radius: 20px;
    width:25%;
    margin-right:5%;
    display: flex;
    justify-content: center;
    align-items: center;
    padding:10px 0;
}
.course-time p{
    font-size:1.8rem;
    color:#fff;
    font-weight: 700;
    line-height: 1.4;
}
.course-time span{
    font-size:2.4rem;
}
.course-curriculum{
    width:70%;
}
.curriculum-ttl{
    font-size:1.8rem;
    font-weight: 700;
    border-bottom:1px solid #EB9144;
}
.course-curriculum ul{
    display: flex;
    flex-wrap: wrap;
}
.course-curriculum ul li{
    font-weight: 500;
    position: relative;
    margin:8px 50px 0 0;
}
.course-curriculum ul li::before{
    content:'';
    display: inline-block;
    width:15px;
    height:15px;
    border-radius: 50%;
    background: #CF001C;
    vertical-align: -0.1em;
    margin-right:5px;
}
.curriculum-time{
    display: flex;
    align-items: center;
    margin-top:5px;
}
.curriculum-time p{
    background:#F7EAE4 ;
    width:140px;
    padding:5px 0;
    text-align: center;
    font-weight: 500;
}
.curriculum-time p > span{
    font-size: 1.4rem;
}
.curriculum-time .plus{
    font-size:4.5rem;
    display: inline-block;
    margin:0 15px;
    font-weight: 200;
}
.flow-item{
    border-radius: 20px;
    padding:20px 40px;
    font-family: "Zen Maru Gothic", sans-serif;
    font-size:2.8rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    margin-top:30px;
    position: relative;
    z-index: 1;
}
.flow-item:nth-of-type(1){
    background: #FA925F;
    border: 2px solid #FA925F;
    color: #fff;
}
.flow-item:nth-of-type(2),
.flow-item:nth-of-type(4)
{
    background: #F0F0F0;
    border: 2px dashed #A2A2A2;
    color:#6A6A6A;
}
.flow-item:nth-of-type(3){
    background: #F47231;
    border: 2px solid #F47231;
    color: #fff;
}
.flow-item:nth-of-type(5){
    background: #1A2C61;
    border: 2px solid #1A2C61;
    color: #fff;
    margin-top:70px;
}
.flow-item .icon{
    width:60px;
    display: inline-block;
    margin-left:40px;
}
.flow-item .exempt{
    margin-left:40px;
    font-size: 1.6rem;
    display: inline-block;
    background:#6A6A6A;
    color:#fff;
    border-radius: 50px;
    padding:0 20px;
}
.flow-item .tag{
    margin-right:30px;
    font-size: 2.8rem;
    padding:0 10px;
    border-radius: 8px;
    background: #CF001C;
}

/* 3 point */
.course-point{
    display: flex;
    justify-content: space-between;
    gap:2.5%;
    margin-top:50px;
}
.course-point li{
    width:calc(100%/3);
    background: #fff;
    box-shadow:0 0 20px rgba(0, 0, 0, 0.25);
    padding:0 20px 40px;
}
.point-num{
    font-family: "Allura", cursive;
    font-size: 8rem;
    color: #CF001C;
    margin-top:-20px;
    line-height: 1;
}
.point-ttl{
    font-family: "Zen Maru Gothic", sans-serif;
    font-size:2rem;
    font-weight: 700;
    text-align: center;
    color: #CF001C;
    margin-bottom:20px;
}
.point-ttl+p{
    padding:0 10px;
}

/* info */
.course-info{
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap:5%;
}
.course-info > div,
.course-info > table{
    width:50%;
}
.course-info table{
    margin-bottom:10px;
}
.course-info table tr th,
.course-info table tr td{
    border:1px solid #EB9144;
    padding:10px 20px;
}
.course-info table tr th{
    background: #EB9144;
    color:#fff;
    font-weight: 700;
    text-align: center;
    vertical-align: middle;
    width:35%;
}
.course-info table tr th{
    border-bottom: 1px solid #fff;
}
.course-info table tr:last-of-type th{
    border-bottom: 1px solid #EB9144;
}
.course-info table tr td{
    background: #fff;
}
.course-info table tr td.bg-or{
    background: #F4E1D8;
    font-weight: 700;
    text-align: center;
}


/* live about */
.live-about-item{
    padding:10px 20px 20px;
    text-align: center;
    background: #fff;
    border:1px solid #1A1A1A;
    border-radius: 10px;
	margin-bottom: 20px
}
.live-about-top-wrap{
	display: flex;
	align-items: center
}
.live-about-icon{
    width:60px;
    margin:0 auto;
}
.live-about-ttl{
	width:calc(100% - 80px);
    font-size:2rem;
    margin:20px 0;
    font-family: "Zen Maru Gothic", sans-serif;
    font-weight: 700;
	text-align: left
}
.live-about-txt{
    font-size:1.5rem;
    text-align: left;
}

/* tag about */
.course-tag-about .cont-inn{
    display: flex;
    justify-content: center;
    gap:2.5%;
    padding:80px 0;
}
.tag-about-item{
    width:calc(100% / 3);
    padding:20px 20px 40px;
    text-align: center;
    background: #fff;
    border:1px solid #1A1A1A;
    border-radius: 10px;
}
.tag-about-icon{
    width:80px;
    margin:0 auto;
}
.tag-about-ttl{
    font-size:2rem;
    margin:20px 0;
    font-family: "Zen Maru Gothic", sans-serif;
    font-weight: 700;
}
.tag-about-txt{
    font-size:1.5rem;
    text-align: left;
}

@media (max-width: 1080px){
    .course-flow dl dt {
        padding: 0 3vw;
        align-items: flex-start;
        justify-content: center;
        flex-direction: column;
    }
    .course-flow dl dt span.tag-r,
    .course-flow dl dt span.tag-b{
        margin:2vw 0 0 0;
    }
}
@media (max-width: 768px){

    #course-01,
    #course-02,
    #option{
        padding:10vw 0;
    }
	.sec-ttl-ja-sub{
		display: block;
		margin-top: 5vw;
		font-size:3.7vw;
		font-weight: 500
	}
	.sec-ttl-ja .couse-no{
		margin-right: 1vw;
		border-radius: 1vw;
		font-size:3.0vw;
	}
	.sec-ttl-ja .couse-no .num{
		font-size:4.5vw;

	}
	
	.course-tag{
        gap:4vw;
    }
    .tag-txt-n,
    .tag-txt-b,
    .tag-txt-r{
        padding:0 5vw;
        font-size:4.1vw;
        border-radius: 7vw;
    }
	.tag-txt-plus{
		font-size:4.1vw;
	}
    .tag-icon{
        width:11.5vw;
    }
    /* course-flow */
    .sec-sub-ttl{
        margin-top:13vw;
    }
    .course-flow::before{
        width:14.286vw;
        height:237.571vw;
        left:0;
        right:0;
        margin:auto;
        bottom: 12.3vw;
    }
    .course-flow dl{
        border-radius: 2.85vw;
        flex-wrap: wrap;
    }
    .course-flow dl+dl{
        margin-top:5vw;
    }
    .course-flow dl dt{
        width:100%;
        font-size:4.1vw;
        padding: 2vw 3vw;
        align-items: center;
        justify-content: center;
        flex-direction: row;
    }
    .course-flow dl dt span.tag-r,
    .course-flow dl dt span.tag-b{
        font-size:3.3vw;
        padding:0 3vw;
        border-radius: 7.15vw;
        margin:0 0 0 3vw;
    }
    .course-flow dl dd{
        width:100%;
        padding:3vw;
    }
    .course-time{
        border-radius: 2.85vw;
        width:24%;
        padding:2vw 0;
    }
    .course-time p{
        font-size:3.5vw;
    }
    .course-time span{
        font-size:4.1vw;
    }
    .course-curriculum{
        width:70%;
    }
    .curriculum-ttl{
        font-size:3.5vw;
    }
    .course-curriculum ul li{
        margin:2vw 5vw 0 0;
        font-size: 3.3vw;
    }
    .course-curriculum ul li::before{
        width:2.143vw;
        height:2.143vw;
        margin-right:1vw;
    }
    .curriculum-time{
        margin-top:3vw;
    }
    .curriculum-time p{
        width:24vw;
        padding:1vw 0;
        font-size: 3.6vw;
        line-height: 1.4;
    }
    .curriculum-time p > span{
        font-size: 3.3vw;
    }
    .curriculum-time .plus{
        font-size:8.1vw;
        margin:0 3vw;
    }
    .flow-item{
        border-radius: 2.85vw;
        padding:2vw 5vw;
        font-size:4.3vw;
        margin-top:5vw;
    }
    .flow-item:nth-of-type(5){
        margin-top:10vw;
    }
    .flow-item .icon{
        width:8.57vw;
        margin-left:5vw
    }
    .flow-item .exempt{
        margin-left:5vw;
        font-size: 3vw;
        border-radius: 7.15vw;
        padding:0 3vw;
    }
    .flow-item .tag{
        margin-right:3vw;
        font-size: 4.3vw;
        padding:0 2vw;
        border-radius: 1.15vw;
    }

    /* 3 point */
    .course-point{
        flex-wrap: wrap;
        gap:0;
        margin-top:8vw;
    }
    .course-point li{
        width:100%;
        padding:0 5vw 5vw;
    }
    .course-point li+li{
        margin-top:8vw;
    }
    .point-num{
        font-size: 12.8vw;
        margin-top:-5vw;
    }
    .point-ttl{
        font-size:4.1vw;
        margin-bottom:3vw;
    }
    .point-ttl+p{
        padding:0;
        font-size: 3.4vw;
    }

    /* info */
    .course-info{
        flex-wrap:wrap;
        gap:0;
    }
    .course-info > div,
    .course-info > table{
        width:100%;
    }
    .course-info > div+table {
        margin-top:7vw;
    }
    .course-info table{
        margin-bottom:2vw;
        width:100%;
    }
    .course-info > div table tr th,
    .course-info > div table tr td{
        display: block;
        font-size: 3.6vw;
    }
    .course-info table tr th{
        text-align: center;
        vertical-align: middle;
        width:50%;
        padding:1vw 5vw;
    }
    .course-info > div table tr th{
        width:auto;
    }
    .course-info > div table tr th{
        border-bottom: none;
    }
    .course-info > div table tr td{
        padding:2vw 5vw;
    }
    .course-info table tr td{
        padding:1vw 5vw;
    }
    .course-info > table tr td{
        text-align: center;
    }
    /* tag about */
    .course-tag-about .cont-inn{
        flex-wrap: wrap;
        gap:0;
        padding:10vw 0;
    }
	
	
	/* live about */
	.live-about-item{
		padding:2vw 4vw 4vw;
		border-radius: 2.667vw;
		margin: 6vw 0
	}
	.live-about-top-wrap{
		display: flex;
		align-items: center
	}
	.live-about-icon{
		width:10vw;
		margin:0 auto;
	}
	.live-about-ttl{
		width:calc(100% - 12vw);
		 font-size:3.9vw;
		margin:4vw 0;
	}
	.live-about-txt{
		font-size:3.5vw;
	}

    .tag-about-item{
        width:100%;
        padding:5vw;
        border-radius: 2.667vw;
    }
    .tag-about-item+.tag-about-item{
        margin-top:5vw;
    }
    .tag-about-icon{
        width:11.5vw;
    }
    .tag-about-ttl{
        font-size:3.9vw;
        margin:3vw 0;
    }
    .tag-about-txt{
        font-size:3.5vw;
    }
}



/*リスキリングを通じたキャリアアップ支援事業*/
.reskilling-box{
    background: #fff;
    border:3px solid #7196CA;
    padding:20px;
    margin:40px 0;
}
.reskilling-box-copy{
    font-family: "Zen Maru Gothic", sans-serif;
    font-size: 2rem;
    font-weight: 700;
    text-align: center;
    line-height: 1.6;
    margin-bottom: 30px;
}
.reskilling-box-copy::after{
    content: "";
    display: block;
    width: 80px;
    height: 7px;
    background: linear-gradient(to right, #d7001e 50%, #e5e5e5 50%);
    margin-top: 20px;
    left:0;
    right:0;
    margin:30px auto auto auto;
}
.reskilling-box-copy span{
    font-size: 2.4rem;
    color:#CF001C;
		display: inline-block
}
.reskilling-box-inn{
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0 40px;
}


@media (max-width: 768px){
	
	.reskilling-box{
        padding:4vw;
        margin:5vw 0;
    }
    .reskilling-box-copy{
        font-size: 3.7vw;
        margin-bottom: 7vw;
    }
    .reskilling-box-copy::after{
        width: 11.429vw;
        height: 1vw;
        margin-top: 4vw;
    }
    .reskilling-box-copy span{
        font-size: 4.16vw;
    }
    .reskilling-box-inn{
        flex-wrap: wrap;
        gap: 0 5vw;
    }
    .reskilling-box-inn+p{
        font-size: 3.5vw;
        padding:0;
    }
    .reskilling-logo{
        width:36.4vw;
        margin-bottom:5vw;
    }
    .reskilling-txt{
        width: 100%;
    }

}