@charset "UTF-8";
/* education/wings01.phpのスタイル */
p, li {
    font-weight: lighter;
}
/* ===============================================
                SPスタイル
=============================================== */
@media screen and (max-width: 768px) {

    /* ↓↓↓ === ページ内共通 === ↓↓↓ */
	dl { padding-bottom: 0; }
	dt { margin: 0; }
	p { margin-top: 0; }
    .sec_ttl {
        width: 100%;
        font-size: 2.4rem;
        font-weight: 700;
        font-style: italic;
        color: #002D69;
        text-align: center;
    }
    .sec_lead {
        width: 100%;
        margin-top: 0.5rem;
        font-style: italic;
        font-weight: bold;
        text-align: center !important
    }
	.sec_description {
		text-align: justify;
		line-height: 1.6;
	}
    /* ↑↑↑ === ページ内共通 === ↑↑↑ */

	.hgroup {
		display: flex;
		flex-direction: column;
		align-items: center;
	}
	.hgroup h3 {
		text-align: center;
	}
	.hgroup h3 span {
		display: block;
	}
	.hgroup .sub-ttl {
		margin-top: 2.64rem;
		font-style: italic;
	}
	.hgroup .title-32 {
		margin: 1rem auto;
	}
	.hgroup figure {
		width: 70%;
	}
	.hgroup picture {
		display: block;
		width: 100%;
	}
	.hgroup picture img {
		width: 100%;
	}


	.wings03_sec01, .wings03_sec02, .wings03_sec03 {
		margin-top: 6rem;
	}
	.wings03_sec01 h4 {
		font-size: 2rem;
		color: #002D69;
	}
	.wings03_sec01 p {
		line-height: 1.6;
	}
	.wings03_sec01 .learning_example {
		display: flex;
		flex-direction: column;
		align-items: center;
		width: 100%;
		margin-top: 3rem;
	}
	.wings03_sec01 .learning_example img {
		width: 90%;
	}
	.wings03_sec01 .learning_example img:last-child {
		margin-top: 3rem;	
	}
	.wings03_sec01 .wings_seminar {
		display: flex;
		flex-direction: column;
		width: 100%;
		padding: 2rem;
		margin-top: 3rem;
		border: 1px solid #002D69;
	}
	.wings_seminar dl, .wings_seminar figure {
		width: 100%;
	}
	.wings_seminar dl {
		display: flex;
		align-self: flex-start; 
		border: none;
	}
	.wings_seminar dl dt {
		width: 100%;
		font-size: 2.4rem;
		font-style: italic;
		color: #002D69;
	}
	.wings_seminar dl dd {
		display: inline-flex;
		font-size: 2rem;
	}
	.wings_seminar dl dd:before {
		content: "●";
		display: inline-block;
	}
	.wings_seminar figure {
		margin-top: 2rem;
	}


	.wings03_sec02 h4,
	.wings03_sec03 h4 {
		font-size: 2.4rem;
		font-weight: 700;
		font-style: italic;
		color: #002D69;
		text-align: left;
	}
	.sec_summary {
		display: flex;
		justify-content: center;
		width: 100%;
	}
	.sec_summary .summ_ttl {
		width: 34%;
		padding: 2px;
		background: #002D69;
	}
	.sec_summary .summ_ttl span {
		display: block;
		width: 100%;
		padding: 0.5rem 1rem;
		background: #eaf1f9;
		color: #002D69;
		line-height: 1.6;
	}
	.sec_summary .summ_desc {
		width: 74%;
		padding: 2px;
		margin-left: -2rem;
		background: #002D69;
		clip-path: polygon( 5% 0, 100% 0, 100% 100%, 0 100% );
	}
	.sec_summary .summ_desc span {
		display: flex;
		justify-content: center;
		align-items: center;
		width: 100%;
		height: 100% !important;
		padding: 0.5rem 1rem;
		background: #eaf1f9;
		color: #002D69;
		line-height: 1.6;
		clip-path: polygon( 5% 0, 100% 0, 100% 100%, 0 100% );
	}
	.wings03_sec02 .sec02_figure {
		margin-top: 2rem;
	}
	.sec02_figure img:nth-child(2) {
		margin-top: 2rem;
	}
	.sec02_figure figcaption {
		font-size: 1.5rem;
		text-align: left;
	}


	.wings03_sec03 .summ_ttl span:before,
	.wings03_sec03 .summ_ttl span:after {
		content: "　";
		display: block;
	}
	.wings03_sec03 .support_image {
		margin-top: 2rem;
	}
	.support_image img:last-child {
		margin-top: 2rem;
	}

	.wings03_sec03 .career_guidance {
		box-sizing: border-box;
		border: 1px solid #002D69;
		padding: 2rem;
		margin-top: 2rem;
	}
	.career_guidance dt {
		width: 100%;
	}
	.career_guidance dl {
		display: flex;
		flex-direction: row;
		justify-content: flex-start; 
		align-self: flex-start;
		flex-wrap: wrap;
		border: none;
	}
	.career_guidance dl dt {
		width: 100%;
		font-size: 2.4rem;
		font-style: italic;
		color: #002D69;
		text-align: left;
	}
	.career_guidance dl dd {
		display: inline-flex;
		width: auto;
		font-size: 2rem;
	}
	.career_guidance dl dd:nth-child(2) {
		margin-right: 2rem;
	}
	.career_guidance dl dd:nth-child(2):before,
	.career_guidance dl dd:nth-child(3):before {
		content: "●";
		display: inline-block;
	}
	.career_guidance dl dd:last-child {
		width: 100%;
		text-align: justify;
	}
	.career_guidance img {
		margin-top: 2rem;
	}
}


/* ===============================================
                PCスタイル
=============================================== */
@media screen and (min-width: 769px) {

    /* ↓↓↓ === 共通 === ↓↓↓ */
    .sec_ttl {
        width: 100%;
        font-size: 2.4rem;
        font-weight: 700;
        font-style: italic;
        color: #002D69;
        text-align: center;
    }
    .sec_lead {
        width: 100%;
        margin-top: 0.5rem;
        font-style: italic;
        font-weight: bold;
    }
    /* ↑↑↑ === 共通 === ↑↑↑ */

    .hgroup {
        display: flex;
        flex-direction: column;
        align-items: center;
        width: 100%;
        margin-top: 56px;
    }
    .hgroup h3 {
        text-align: center;
    }
    .hgroup h3 span {
        display: block;
    }
    .hgroup .sub-ttl {
        margin-top: 2.64rem;
        font-style: italic;
    }
    .hgroup .title-32 {
        margin: 1rem auto;
    }
    .hgroup figure {
        width: 100%;
    }
    .hgroup picture {
        display: block;
        width: 100%;
    }


    .wings03_sec01 {
        display: flex;
        flex-direction: column;
        align-items: center;
        margin-top: 60px;
    }
    .wings03_sec01 h4 {
        width: 100%;
        font-weight: bold;
        font-style:  italic;
			color: #002D69;
			font-size:1.2em;
    }
    .wings03_sec01 p {
        font-size: 1.728rem;
        font-weight: lighter;
        font-style: normal;
        color: #333;
    }

    .wings03_sec01 .learning_example {
        display: flex;
        justify-content: space-between;
        align-items: center;
        width: 100%;
        margin-top: 30px;
    }
    .learning_example img {
        width: 48%;
        height: auto;
    }

    .wings03_sec01 .wings_seminar {
        display: flex;
        justify-content: space-between;
        align-items: flex-start;
        box-sizing: border-box;
        width: 76%;
        padding: 20px;
        margin-top: 50px;
        border: 1px solid #002D69;
    }
    .wings_seminar dl {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        border: none;
    }
    .wings_seminar dl dt {
        width: 100%;
        font-size: 2.4rem;
        font-style: italic;
        color: #002D69;
    }
    .wings_seminar dl dd {
        width: 92%;
        margin-left: 2rem;
        text-align: left;
        position: relative;
    }
    .wings_seminar dl dd:before {
        content: "●";
        display: block;
        position: absolute;
        top: 0;
        left: -2rem;
    }


    .wings03_sec02 {
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
        margin-top: 70px;
        width: 100%;
    }
    .wings03_sec02 h4,
	.wings03_sec03 h4 {
        font-size: 2.4rem;
        font-weight: 700;
        font-style: italic;
        color: #002D69;
        text-align: left;
    }
    .wings03_sec02 .sec02_main,
    .wings03_sec02 .sec02_figure {
        width: 49%;
    }

    .sec_description {
        margin: 0;
		font-size: 1.5rem;
		line-height: 1.6;
        text-align: justify;
    }

	.sec_summary {
		display: flex;
		justify-content: flex-start;
		align-items: flex-start;
		height: 3.5rem;
		margin-top: 1.6rem;
	}
	.sec_summary p span {
		font-size: 1.5rem;
	}
    .sec_summary .summ_ttl {
        width: 36%;
        padding: 1px;
		margin-right: -6%;
        background: #002D69;
    }
    .sec_summary .summ_ttl span {
        content: "";
        display: block;
        padding: 1rem 2rem 1rem 0;
        background: #eaf1f9;
        color: #002D69;
    }
	.sec_summary .summ_desc {
		width: 70%;
		padding: 1px;
		margin: 0;
		background: #002D69;
		clip-path: polygon( 5% 0, 100% 0, 100% 100%, 0 100% );
	}
	.sec_summary .summ_desc span {
		content: "";
		display: block;
		padding: 1rem 0 1rem 2rem;
		background: #eaf1f9;
		color: #002D69;
		clip-path: polygon(5% 0, 100% 0, 100% 100%, 0 100%);
	}

    .sec02_figure {
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
    }
    .sec02_figure img {
        width: 49%;
    }
    .sec02_figure figcaption {
        width: 100%;
		font-size: 1.4rem;
		font-weight: 400;
		color: #333;
		text-align: left;
    }



	.wings03_sec03 {
		margin-top: 70px;
	}
	.wings03_sec03 .sec_summary {
		width: 49%;
	}
	.wings03_sec03 .sec_summary .summ_ttl {
		width: 30%;
		margin-right: -6%;
	}
	.wings03_sec03 .sec_summary .summ_desc {
		width: 76%;
		margin: 0;
		background: #002D69;
	}
	.wings03_sec03 .support_image,
	.wings03_sec03 .career_guidance {
		display: flex;
		justify-content: space-between;
		margin-top: 35px;
	}
	.wings03_sec03 .support_image img {
		width: 47%;
			height: auto;
			object-fit: contain;
	}


	.wings03_sec03 .career_guidance dl {
		display: flex;
		flex-direction: row;
		justify-content: flex-start;
		align-self: flex-start;
		flex-wrap: wrap;
		width: 28%;
		border: none;
		font-size: 1.5rem;
		line-height: 1.4 !important;
	}
	.career_guidance dl dt,
	.career_guidance dl dd {
		text-align: left;
	}
	.career_guidance dl dt {
		width: 100%;
		font-size: 2rem;
		font-style: italic;
		color: #002D69;
	}
	.career_guidance dl dd:nth-child(2),
	.career_guidance dl dd:nth-child(3) {
		display: inline-flex;
		width: auto;
		height: auto;
		margin: 1rem 2rem 0 0;
		line-height: normal;
	}
	.career_guidance dl dd:nth-child(2):before,
	.career_guidance dl dd:nth-child(3):before {
		content: "●";
		display: inline-block;
	}
	.career_guidance dl dd:last-child {
		width: 100%;
		margin-top: 1rem;
		text-align: justify;
		line-height: 1.6;
	}
	.career_guidance figure {
		display: flex;
		justify-content: space-between;
		width: 70%;
	}
	.career_guidance figure img:first-child {
		width: 59%;
		height: auto;
	}
	.career_guidance figure img:last-child {
		width: 40%;
	}
}