@charset "UTF-8";

/* 共通 */

html,
body,
div,
span,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
abbr,
address,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
samp,
small,
strong,
sub,
sup,
var,
b,
i,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section,
summary,
time,
mark,
audio,
video,
input,
select,
textarea {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    font-style: normal;
    font-weight: 500;
    letter-spacing: 0;
    vertical-align: bottom;
    background: 0 0;
}

@media screen and (max-width: 1500px) {
    /* html {
        font-size: .6vw !important;
    } */
}

@media screen and (max-width: 1200px) {
    html {
        font-size: 60% !important;
    }
}

@media screen and (max-width: 910px) {
    html {
        font-size: 1vw !important;
    }
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
menu,
nav,
section {
    display: block;
}

ul,
li {
    list-style: none;
}

a {
    text-decoration: none;
    color: #111;
}

a:hover {
    text-decoration: none;
}

html {
    font-size: 62.5%;
    overflow: auto;
}

html.is-fixed {
    overflow: hidden;
}

body {
    min-width: 320px;
	font-family: source-han-sans-japanese, sans-serif;
	font-weight: 500;
	font-style: normal;
    color: #666666;
    font-size: 1.5rem;
    line-height: 1.5;
    -webkit-text-size-adjust: 100%;
}

*:focus {
    outline: none;
}

small {
    font-size: .8em;
    vertical-align: baseline;
}

img {
    max-width: 100%;
    height: auto;
}

.sp {
    display: none;
}

.clearfix::after {
    content: "";
    display: block;
    clear: both;
}

.f_l {
    float: left;
}

.f_r {
    float: right;
}

.clear {
    clear: both;
}

@media only screen and (max-width:749px) {
    body {
        font-size: 3vw;
    }
    .pc {
        display: none;
    }
    .sp {
        display: block;
    }
}


/* ヘッダー */

#header {
    display: flex;
    width: calc(calc(100% - 160px) / 2);
    height: 100%;
    position: fixed;
    left: 0;
    top: 0;
    overflow: hidden;
}

/* @media screen and (min-width: 1500px) {
    #header {
        width: calc(100% - 910px);
    }
} */

@media screen and (max-width: 1200px) {
    #header {
        display: block;
        width: calc(100% - 160px);
        height: auto;
        position: relative;
        overflow: auto;
    }
}

#header .logo
{
    position: absolute;
    top: 0;
    left: 5%;
    width: 90%;
    padding: 10px 20px;
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1;
}
#header .logo ul				{ display:flex; }
#header .logo ul li:nth-child(1){ width:177px; margin-right:50px; }
#header .logo ul li:nth-child(2){ width:316px; }
#header .logo ul li img			{ width:100%; }

@media only screen and (min-width:1200px) and (max-width:1449px)
{
	#header .logo ul				{ display:flex; justify-content:center; }
	#header .logo ul li:nth-child(1){ width:30.73%; margin-right:8.68%; }
	#header .logo ul li:nth-child(2){ width:54.86%; }
	#header .logo ul li img			{ width:100%; }
}
@media only screen and (min-width:750px) and (max-width:799px)
{
	#header .logo ul				{ display:flex; justify-content:center; }
	#header .logo ul li:nth-child(1){ width:30.73%; margin-right:8.68%; }
	#header .logo ul li:nth-child(2){ width:54.86%; }
	#header .logo ul li img			{ width:100%; }
}
@media only screen and (max-width:749px)
{
	#header .logo ul				{ display:flex; justify-content:center; }
	#header .logo ul li:nth-child(1){ width:27.23%; margin-right:7.5%; }
	#header .logo ul li:nth-child(2){ width:48.62%; }
	#header .logo ul li img			{ width:100%; }
}

#header #mv
{
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    overflow: hidden;
    z-index: 0;
}
#header #mv video
{
	position	: absolute;
	top			: 50%;
	left		: 50%;
	object-fit	: cover;
	transform	: translate(-50%, -50%);
	width		: 100%;
	height		: 100%;
}

@media screen and (max-width: 1200px)
{
    #header #mv
	{
        position	: relative;
        top			: auto;
        right		: auto;
        bottom		: auto;
        left		: auto;
        overflow	: auto;
        height		: 100vh;
    }
}
@media screen and (min-width: 1201px)							{ #header #mv {min-height:  750px} }
@media screen and (min-width:  750px) and (max-width: 1200px)	{ #header #mv {min-height: 1110px} }
@media screen and (max-width:  749px)							{ #header #mv {min-height:  120vw} }


#header .txt {
    font-size: 2rem;
    font-weight: 700;
    color: #fff;
    position: absolute;
    bottom: 2rem;
    left: 0;
    width: 100%;
    z-index: 5;
    text-align: center;
    opacity: 0;
    transition: 1.6s 0.6s;
}

#header .txt.show {
    opacity: 1;
}

@media only screen and (max-width:749px) {
    #header .logo {
        position: absolute;
        top: 0;
        left: 5%;
        width: 90%;
        padding: 10px 20px;
        background: #fff;
        display: flex;
        align-items: center;
        justify-content: center;
        z-index: 1;
    }
}

@media only screen and (max-width:749px) {
    #header {
        width: 100%;
    }
    #header .logo {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 50px;
        padding: 10px 50px 10px 10px;
        background: #fff;
        display: flex;
        align-items: center;
        justify-content: center;
        z-index: 1;
    }
    #header .logo img {
        width: auto;
    }
    #header .header_menu {
        position: fixed;
        top: 0;
        right: 0;
        z-index: 10;
        width: 50px;
        cursor: pointer;
    }
    #header .txt {
        font-size: 4rem;
        bottom: 4rem;
    }
}


/* メニュー */

#menu {
    width				: 160px;
    height				: 100%;
    background-color	: #b02c33;
    position			: fixed;
    right				: 0;
    top					: 0;
    padding				: 20px;
    background-image	: url(../img/header_menu_bg.png);
    background-repeat	: no-repeat;
    background-position	: 30px top;
    background-size		: 130px auto;
	overflow			: scroll;
	scrollbar-width: none; /*Firefox対応のスクロールバー非表示コード*/
	-ms-overflow-style: none;/*Internet Explore対応のスクロールバー非表示コード*/
}

#menu::-webkit-scrollbar {
	display: none; /*Google Chrome、Safari、Microsoft Edge対応のスクロールバー非表示コード*/
}

#menu .nav {
    margin: 60px auto;
}

#menu .nav li {
    margin-bottom: 30px;
}

#menu .nav li a {
    color: #fff;
    font-size: 1.6rem;
}

#menu .nav li a:hover {
    text-decoration: underline;
}

#menu .bnr {
    margin: 30px auto;
}

#menu .bnr li {
    margin-bottom: 20px;
}

#menu .bnr li a {
    display: block;
    text-align: center;
    font-size: 1.4rem;
    line-height: 1.4em;
    background: #fff;
    color: #666666;
    text-decoration: none;
    padding: 10px 0;
}

#menu .bnr li a:hover {
    opacity: .7;
}

#menu .sns {
    display: flex;
    justify-content: space-between;
}

#menu .sns li {
    width: 24px;
}

@media only screen and (max-width:749px) {
    #menu {
        width: 84vw;
        height: 100%;
        right: 0;
        top: 0;
        padding: 8vw;
        background-position: right 0vw top 38vw;
        background-size: 44vw auto;
        z-index: 10000;
        transform: translateX(84vw);
        transition: .3s;
    }
    #menu.open {
        transform: translateX(0);
    }
    #menuBg {
        content: '';
        position: fixed;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        background: #000;
        display: block;
        z-index: 9999;
        opacity: .4;
        display: none;
    }
    #menu.open+#menuBg {
        display: block;
    }
    #menu .menu_close {
        position: absolute;
        right: 0;
        top: 0;
        width: 50px;
        height: 50px;
    }
    #menu .nav {
        margin: 14vw auto;
    }
    #menu .nav li {
        margin-bottom: 6vw;
    }
    #menu .nav li a {
        color: #fff;
        font-size: 4vw;
    }
    #menu .bnr {
        margin: 10vw auto;
    }
    #menu .bnr li {
        margin-bottom: 3vw;
    }
    #menu .bnr li a {
        font-size: 4vw;
        line-height: 4vw;
        padding: 6vw 0;
        position: relative;
        font-weight: 700;
    }
    #menu .bnr li:first-child a {
        padding-left: 9vw;
    }
    #menu .bnr li:first-child a::before {
        content: '';
        background-image: url(../img/header_window_icon.png);
        background-repeat: no-repeat;
        background-size: contain;
        background-position: center;
        width: 4vw;
        height: 4vw;
        position: absolute;
        left: 14vw;
        top: calc(50% - 2vw);
    }
    #menu .sns {
        justify-content: flex-start;
    }
    #menu .sns li {
        width: 8vw;
        margin-right: 4vw;
    }
}


/* フッター */

#footer {
    padding: 60px 0 0;
	text-align:center;
}

#footer .address {
    font-size: 1.6rem;
    margin-top: 30px;
}

#footer .tel_number {
    font-size: 1.6rem;
}

#footer .tel_number a {
    /* margin-right: 3em; */
    pointer-events: none;
    color: #666;
}
#footer .tel_number a::after {
    display: inline-block;
    content: "/";
    margin: 0 1em;
}


#footer .sns
{
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 164px;
    margin: 40px auto 20px;
}
@media all and (-ms-high-contrast: none)
{
	/*
	#footer .sns		{width: 300px;}
	*/
	#footer .sns li a		{ width:100%; }
	#footer .sns li a img	{ width:auto; }
}

#footer .sns li {
    width: 30px;
    display: flex;
}

#footer .copyright {
    font-size: 1.2rem;
    color: #fff;
    background: #8c8c8c;
    text-align: center;
    padding: 20px;
}


#footer ul.footer_logo 					{ display:flex; justify-content:center; }
#footer ul.footer_logo li:nth-child(1)	{ width:181px; margin-right:50px; }
#footer ul.footer_logo li:nth-child(2)	{ width:322px; }
#footer ul.footer_logo li img			{ width:100%; }

@media only screen and (max-width:749px)
{
	#footer ul.footer_logo					{ width: 70vw; flex-wrap:wrap; margin:0 auto; }
	#footer ul.footer_logo li				{ width: 100%; }
	#footer ul.footer_logo li:nth-child(3)	{ margin-bottom:30px; }
	#footer ul.footer_logo li img			{ width: 100%; }
}


@media only screen and (max-width:749px) {
    #footer {
        padding: 4vw 0 0;
    }
    #footer .logo {
        width: 70vw;
    }
    #footer .address {
        font-size: 3.6rem;
        margin-top: 6vw;
        margin-bottom: 6vw;
    }
    #footer .tel_number {
        font-size: 5rem;
    }
    #footer .tel_number span {
        display: block;
        margin: 6vw auto;
        width: 80vw;
        text-align: center;
    }
    #footer .tel_number a {
        display: block;
        margin: auto;
        width: 80vw;
        text-align: center;
        pointer-events: auto;
        color: #fff;
        background: #b02c33;
        padding: 4vw;
        box-shadow: 1vw 1vw .5vw 0 rgba(153, 153, 153, 0.2);
    }

    #footer .tel_number a::after {
        display: none;
    }
    #footer .sns {
        width: 46vw;
        margin: 6vw auto 6vw;
    }
    #footer .sns li {
        width: 8vw;
    }
    #footer .copyright {
        font-size: 3rem;
        padding: 3rem;
    }
}


/* コンテンツ共通 */

#container {
    width: 100%;
    padding: 0;
}

/* #container #contents {
    margin-left: calc(calc(100% - 160px) / 2);
    margin-right: 160px;
} */

/* @media screen and (min-width: 1500px) {
    #container #contents {
        width: 750px;
        margin-left: calc(100% - 910px);
    }
} */

@media screen and (max-width: 1200px) {
    #container #contents {
        width: calc(100% - 160px);
        margin-left: 0;
    }
}

#main .index {
    padding: 30px;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}

#main .index li {
    width: 30%;
    margin: 0 1.5% 20px;
    height: 110px;
    text-align: center;
    position: relative;
    display: flex;
    background-size: 15px auto;
    transition: .2s;
    will-change: transform;
}
#main .index li:hover{
    transform: scale(1.05);
}

#main .index li a {
    display: flex;
    width: 100%;
    height: 110px;
    position: relative;
    background-size: 15px auto;
    align-items: center;
    justify-content: center;
    font-size: 1.8rem;
    line-height: 1.2em;
    color: #666666;
    z-index: 1;
    padding-bottom: 5px;
}

#main .index li a:hover
{
	font-size: 1.8rem;
	font-weight:bold;
	box-shadow: 0 10px 10px rgba(0, 0, 0, .1);
}

#main .index li a::before {
    content: '';
    position: absolute;
    left: calc(50% - 7px);
    bottom: 25px;
    width: 14px;
    height: 14px;
    border-bottom: 2px solid #666;
    border-right: 2px solid #666;
    transform: rotate(45deg);
}

#main .index li a::after {
    content: '';
    position: absolute;
    top: 10px;
    left: 10px;
    right: 10px;
    bottom: 10px;
    background-color: #fff;
    z-index: -1;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 45px auto;
}
#main .index li:nth-child(1),
#main .index li:nth-child(1) a {
    background-image: url(../img/bg_grid01.png);
}

#main .index li:nth-child(1) a::after {
    background-image: url(../img/menu_bg01.png);
}

#main .index li:nth-child(2),
#main .index li:nth-child(2) a {
    background-image: url(../img/bg_grid02.png);
}

#main .index li:nth-child(2) a::after {
    background-image: url(../img/menu_bg02.png);
}

#main .index li:nth-child(3),
#main .index li:nth-child(3) a {
    background-image: url(../img/bg_grid03.png);
}

#main .index li:nth-child(3) a::after {
    background-image: url(../img/menu_bg03.png);
}

#main .index li:nth-child(4),
#main .index li:nth-child(4) a {
    background-image: url(../img/bg_grid04.png);
}

#main .index li:nth-child(4) a::after {
    background-image: url(../img/menu_bg04.png);
}

#main .index li:nth-child(5),
#main .index li:nth-child(5) a {
    background-image: url(../img/bg_grid05.png);
}

#main .index li:nth-child(5) a::after {
    background-image: url(../img/menu_bg05.png);
}

@media screen and (min-width: 1501px){
    #main .index li {
        width: 29%;
    }
    #main .index li a:hover	{font-size: 2.0rem;}
}
@media screen and (max-width: 1500px){ #main .index li a		{font-size: 1.8rem;} }

.inner {
    max-width	: 690px;
    margin		: auto;
}

@media screen and (max-width: 1500px) {
    .inner {
        margin: auto 20px;
    }
}

@media screen and (max-width: 1200px) {
    .inner {
        margin: auto;
    }
}

@media screen and (max-width: 910px) {
    .inner {
        margin: auto 10px;
    }
}

.ttl01 {
    background-image: url(../img/ttl_bg01.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    padding-top: 45px;
    padding-bottom: 10px;
    font-size: 1.8rem;
    font-weight: 700;
    line-height: 1.5em;
    text-align: center;
    color: #666666;
    margin-bottom: 30px;
}

.ttl02 {
    font-size: 2.8rem;
    line-height: 1.5em;
    font-weight: 500;
    padding-left: 10px;
    border-left: 10px solid #000;
    margin-bottom: 30px;
    letter-spacing: .01em;
}

@media screen and (max-width: 1500px) {
    .ttl02 {
        font-size: 2.6rem;
    }
}

.txt01 {
    font-size: 3.8rem;
    line-height: 1.6em;
    text-align: center;
    font-weight: 700;
    margin-bottom: 30px;
}

.txt02 {
    font-size: 1.8rem;
    line-height: 1.7em;
    text-align: center;
    margin-bottom: 20px;
}

.txt03 {
    font-size: 2.8rem;
    line-height: 1.6em;
    text-align: center;
    font-weight: 700;
    margin-bottom: 10px;
}

.line01 span {
    font-weight: 700;
    background: linear-gradient(transparent 70%, rgba(243, 149, 19, .5) 0%);
}

.line02 span {
    font-weight: 700;
    background: linear-gradient(transparent 70%, rgba(170, 205, 6, .5) 0%);
}

.line03 span {
    font-weight: 700;
    background: linear-gradient(transparent 70%, rgba(96, 193, 189, .5) 0%);
}

.line04 span {
    font-weight: 700;
    background: linear-gradient(transparent 70%, rgba(186, 151, 196, .5) 0%);
}

.line05 span {
    font-weight: 700;
    background: linear-gradient(transparent 70%, rgba(238, 134, 180, .5) 0%);
}

#sec01,
#sec02,
#sec03,
#sec04,
#sec05 {
    background-size: 15px auto;
    padding: 40px 5px;
}

#sec01 {
    background-image: url(../img/bg_grid06.png);
    margin-bottom: 100px;
}

#sec01 .ttl02 {
    border-left: 10px solid #f08200;
    color: #f08200;
}

#sec02 {
    background-image: url(../img/bg_grid07.png);
    margin-bottom: 100px;
}

#sec02 .ttl02
{
	/*
	border-left	: 10px solid #aacd06;
	color		: #aacd06;
	*/
	border		: none;
	color		: #fff;
	background	: #aacd06;
	display		: table;
	padding		: 2px 10px;
	margin		: 0 0 15px 0;
}
@media screen and (max-width: 749px)
{
	#sec02 .ttl02{ margin:0 auto 15px; }
}

#sec03 {
    background-image: url(../img/bg_grid08.png);
    margin-bottom: 100px;
}

#sec04 {
    background-image: url(../img/bg_grid09.png);
    margin-bottom: 100px;
}

#sec04 .ttl02 {
    border-left: 10px solid #ba97c4;
    color: #ba97c4;
}

#sec05 {
    background-image: url(../img/bg_grid10.png);
    margin-bottom: 40px;
}

#sec05 .ttl02 {
    border-left: 10px solid #ee86b4;
    color: #ee86b4;
}

.more_btn {
    width: 300px;
    margin: 2rem auto;
}

.more_btn a {
    display: block;
    background-color: #fff;
    text-align: center;
    padding: 1.5rem;
    color: #666;
    font-weight: 700;
    font-size: 1.6rem;
    position: relative;
    padding-left: 4rem;
    transition: .3s;
    box-shadow: 10px 10px 7px 0 rgba(153, 153, 153, 0.2);
}

.more_btn a:hover {
    opacity: .7;
}

.more_btn a::before {
    content: '';
    background-image: url(../img/window_icon.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    width: 2rem;
    height: 2rem;
    position: absolute;
    left: 6rem;
    top: calc(50% - 1rem);
}

@media screen and (max-width: 749px) {
    #container #contents {
        width: 100%;
    }
    #main .index {
        width: 100%;
        padding: 6vw 0 2vw;
    }
    #main .index li {
        width: 26vw;
        margin: 0 2vw 4vw;
        height: 26vw;
        text-align: center;
        position: relative;
        display: flex;
        background-size: 10px auto;
    }
    #main .index li:nth-child(4),
    #main .index li:nth-child(5) {
        width: 30vw;
    }
    #main .index li a {
        width: 100%;
        height: 26vw;
        background-size: 10px auto;
        font-size: 3.2rem;
        line-height: 1.5em;
        padding-bottom: 1vw;
    }
    #main .index li a:hover {
        font-size: 3.6rem;
    }
    #main .index li a::before {
        content: '';
        position: absolute;
        left: calc(50% - 1vw);
        bottom: 7vw;
        width: 2vw;
        height: 2vw;
    }
    #main .index li a::after {
        top: 2vw;
        left: 2vw;
        right: 2vw;
        bottom: 2vw;
        background-size: 12vw auto;
    }
    .inner {
        margin: auto 4vw;
    }
    .ttl01 {
        padding-top: 10vw;
        padding-bottom: 3vw;
        font-size: 3.6rem;
        margin-bottom: 4vw;
    }
    .ttl02 {
        font-size: 5.4rem;
        line-height: 1.5em;
        font-weight: 500;
        padding-left: 2vw;
        border-left: 2vw solid #000;
        margin-bottom: 30px;
        letter-spacing: .01em;
    }
    .txt01 {
        font-size: 7rem;
        margin-bottom: 4vw;
    }
    .txt02 {
        font-size: 4rem;
        line-height: 1.7em;
        text-align: left;
        margin-bottom: 20px;
    }
    .txt03 {
        font-size: 5rem;
        margin-bottom: 1vw;
    }
    #sec01,
    #sec02,
    #sec03,
    #sec04,
    #sec05 {
        background-size: 10px auto;
        padding: 6vw 0;
    }
    #sec01 {
        margin-bottom: 10vw;
    }
    #sec01 .ttl02 {
        border-left: 2vw solid #f08200;
    }
    #sec02 {
        margin-bottom: 10vw;
    }
    #sec02 .ttl02 {
        border-left: 2vw solid #aacd06;
    }
    #sec03 {
        margin-bottom: 10vw;
    }
    #sec04 {
        margin-bottom: 10vw;
    }
    #sec04 .ttl02 {
        border-left: 2vw solid #ba97c4;
    }
    #sec05 {
        margin-bottom: 6vw;
    }
    #sec05 .ttl02 {
        border-left: 2vw solid #ee86b4;
    }
    .more_btn {
        width: 74vw;
        margin: 4rem auto 6rem;
    }
    .more_btn a {
        padding: 4rem;
        font-size: 4rem;
        padding-left: 10rem;
        box-shadow: 1vw 1vw .5vw 0 rgba(153, 153, 153, 0.2);
    }
    .more_btn a::before {
        width: 4rem;
        height: 4rem;
        left: 16rem;
        top: calc(50% - 2rem);
    }
}


/*学部・学科*/

.sec01_list
{
	display			: flex;
	justify-content	: flex-start;
	flex-wrap		: wrap;
}

.sec01_list li
{
	display			: flex;
	width			: 32%;
	margin-right	: 2%;
	margin-bottom	: 2rem;
	position		: relative;
}
.sec01_list li a
{
	display			: flex;
	width			: 100%;
	color			: #666666;
}

.sec01_list li:nth-child(3n)
{
	margin-right: 0;
}

.sec01_list li .image
{
	position	: absolute;
	top			: 0;
	left		: 0;
	width		: 100%;
}

.sec01_list li .detail
{
	width		: 95%;
	margin-top	: 5%;
	margin-left	: 5%;
	padding		: 17rem 1rem 2rem;
	background	: #fff;
	box-shadow	: 6px 6px 3px 0 rgba(153, 153, 153, 0.2);
}

@media screen and (max-width: 910px)
{
	.sec01_list li .detail
	{
		padding: 18vw 1vw 2vw;
	}
}

.sec01_list li .detail h4
{
	font-size: 2rem;
	font-weight: 700;
	margin-bottom: .2em;
}

.sec01_list li .detail p {
    font-size: 1.4rem;
}

@media screen and (max-width: 749px)
{
    .sec01_list li
	{
        width: 48%;
        margin-right: 4%;
        margin-bottom: 5rem;
    }
    .sec01_list li:nth-child(3n)
	{
        margin-right: 4%;
    }
    .sec01_list li:nth-child(2n)
	{
        margin-right: 0;
    }
    .sec01_list li .image
	{
        position: absolute;
        top: 0;
        left: 0;
        width: 96%;
    }
    .sec01_list li .detail
	{
        padding: 32vw 3vw 3vw;
        box-shadow: 1vw 1vw .5vw 0 rgba(153, 153, 153, 0.2);
    }
    .sec01_list li .detail h4
	{
        font-size: 3.8rem;
        font-weight: 700;
        margin-bottom: .2em;
    }
    .sec01_list li .detail p
	{
        font-size: 2.8rem;
    }
}


/*教育プログラム*/

.sec02_box::after {
    content: '';
    display: block;
    height: 0;
    clear: both;
}

.sec02_box .image {
    float: right;
    width: 48%;
    margin: auto auto 1rem 3rem;
}

.sec02_box p {
    font-size: 1.6rem;
    line-height: 1.7em;
}

#sec02 .more_btn {
    margin-bottom: 6rem;
}

@media screen and (max-width: 749px) {
    .sec02_box .image {
        float: none;
        width: 100%;
        margin: auto auto 4vw;
    }
    .sec02_box p {
        font-size: 3.5rem;
        line-height: 1.7em;
    }
    #sec02 .more_btn {
        margin-bottom: 10rem;
    }
}


/*在校生インタビュー*/

#sec03 .inner {
    max-width: 100%;
    margin: auto;
}

#sec03 .ttl01,
#sec03 .txt01,
#sec03 .txt02 {
    margin-left: 20px;
    margin-right: 20px;
}

#sec03 .slide_img {
    height: 520px;
    width: auto;
    display: block;
    margin: auto 1rem;
}

#sec03 .slide .modal {
    cursor: pointer;
}

.slick-prev:before,
.slick-next:before {
    display: none;
}

.slick-prev,
.slick-next {
    position: absolute;
    top: 50%;
    display: block;
    width: 6.6rem;
    height: 6.6rem;
    padding: 0;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: contain !important;
    z-index: 100 !important;
}

.slick-prev {
    content: '';
    background-image: url(../img/slide_prev.png) !important;
    left: calc(50% - 25rem);
}

.slick-next {
    content: '';
    background-image: url(../img/slide_next.png) !important;
    right: calc(50% - 25rem);
}

.slick-dots li {
    width: 3.5rem;
    height: .7rem;
    margin: 0 .7rem;
}

.slick-dots li button {
    width: 3.5rem;
    height: .7rem;
    padding: 0;
}

.slick-dots li button:before {
    position: absolute;
    width: 3.5rem;
    height: .7rem;
    content: '';
    background: #fff;
    border: 2px solid #60c1bd;
    opacity: 1 !important;
}

.slick-dots li.slick-active button:before {
    background: #60c1bd;
}

.interview_content {
    position: relative;
    max-height: calc(100vh - 150px);
    overflow-y: auto;
    padding: 2rem;
    text-align: left;
    color: #666;
}

.sec03_img01 {
    margin-bottom: 2rem;
}

.sec03_img02 {
    margin: 2rem auto;
}

.sec03_ttl01 {
    font-size: 1.7rem;
    font-weight: 500;
}

.sec03_ttl01 span {
    font-size: 3.2rem;
    font-weight: 700;
    margin-right: .2em;
}

.sec03_ttl01 rt {
    font-size: 1.6rem;
    font-weight: 500;
}

.sec03_ttl02 {
    font-size: 2.2rem;
    line-height: 1.5em;
    font-weight: 500;
    margin-top: 4rem;
    margin-bottom: .5em;
    padding-left: .5em;
}

.sec03_txt01 {
    font-size: 1.6rem;
    font-weight: 700;
}

.sec03_txt02 {
    font-size: 1.6rem;
}

.sec03_txt03 {
    font-size: 1.6rem;
	line-height: 1.7em;
    margin-bottom: 1em;
}

.sec03_txt04 {
    font-size: 1.8rem;
}

[data-remodal-id='interview01'] .sec03_ttl02 {
    color: #ee86b4;
    border-left: 1.5rem solid #ee86b4;
}

[data-remodal-id='interview01'] .sec03_ttl01 span {
    font-weight: 700;
    background: linear-gradient(transparent 60%, #f6c2d9 0%);
}

[data-remodal-id='interview02'] .sec03_ttl02 {
    color: #aacd06;
    border-left: 1.5rem solid #aacd06;
}

[data-remodal-id='interview02'] .sec03_ttl01 span {
    font-weight: 700;
    background: linear-gradient(transparent 60%, #d4e682 0%);
}

[data-remodal-id='interview03'] .sec03_ttl02 {
    color: #fdd000;
    border-left: 1.5rem solid #fdd000;
}

[data-remodal-id='interview03'] .sec03_ttl01 span {
    font-weight: 700;
    background: linear-gradient(transparent 60%, #fff87f 0%);
}

[data-remodal-id='interview04'] .sec03_ttl02 {
    color: #ba97c4;
    border-left: 1.5rem solid #ba97c4;
}

[data-remodal-id='interview04'] .sec03_ttl01 span {
    font-weight: 700;
    background: linear-gradient(transparent 60%, #dccbe1 0%);
}

[data-remodal-id='interview05'] .sec03_ttl02 {
    color: #f6ab00;
    border-left: 1.5rem solid #f6ab00;
}

[data-remodal-id='interview05'] .sec03_ttl01 span {
    font-weight: 700;
    background: linear-gradient(transparent 60%, #fad57f 0%);
}

[data-remodal-id='interview06'] .sec03_ttl02 {
    color: #60c1bd;
    border-left: 1.5rem solid #60c1bd;
}

[data-remodal-id='interview06'] .sec03_ttl01 span {
    font-weight: 700;
    background: linear-gradient(transparent 60%, #afe0de 0%);
}

@media screen and (max-width: 749px) {
    #sec03 .ttl01,
    #sec03 .txt01,
    #sec03 .txt02 {
        margin-left: 4vw;
        margin-right: 4vw;
    }
    #sec03 .slide_img {
        height: auto;
        width: 76vw;
    }
    .slick-prev,
    .slick-next {
        width: 12vw;
        height: 12vw;
        top: 45%;
    }
    .slick-prev {
        left: calc(50% - 46vw);
    }
    .slick-next {
        right: calc(50% - 46vw);
    }
    .slick-dots {
        bottom: -4vw;
    }
    .slick-dots li {
        width: 6rem;
        height: 1rem;
        margin: 0 1rem;
    }
    .slick-dots li button {
        width: 6rem;
        height: 1rem;
    }
    .slick-dots li button:before {
        width: 6rem;
        height: 1rem;
        border: 1px solid #60c1bd;
    }
    .interview_content {
        max-height: 75vh;
        padding: 4vw;
    }
    .sec03_img01 {
        margin-bottom: 4rem;
    }
    .sec03_img02 {
        margin: 4rem auto;
    }
    .sec03_ttl01 {
        font-size: 5rem;
    }
    .sec03_ttl01 span {
        font-size: 7.5rem;
    }
    .sec03_ttl01 rt {
        font-size: 3rem;
    }
    .sec03_ttl02 {
        font-size: 4rem;
        margin-top: 6rem;
        margin-bottom: .5em;
        padding-left: .5em;
    }
    .sec03_txt01 {
        font-size: 4rem;
        font-weight: 700;
    }
    .sec03_txt02 {
        font-size: 3.6rem;
    }
    .sec03_txt03 {
        font-size: 3.6rem;
        margin-bottom: 1em;
    }
    .sec03_txt04 {
        font-size: 2.8rem;
    }
}


/*地域別　出身校／就職先*/
#areaMap text.active
{
	-webkit-filter:drop-shadow(0px 1px 2px #592867);
	-moz-filter:drop-shadow(0px 1px 2px #592867);
	-ms-filter:drop-shadow(0px 1px 2px #592867);
	filter:drop-shadow(0px 1px 2px #592867);
	position: relative;
}

.cls-1 {
    fill: none;
    stroke: #bbbaba;
    stroke-miterlimit: 10;
}

.cls-2 {
    fill: #d9d9d9;
    opacity: .6;
}

.cls-2.active {
    fill: #ba97c4;
    opacity: 1;
}

.cls-3 {
    fill: #bbbaba;
}

.cls-4 {
    font-size: 18px;
    fill: #666;
}

.cls-4.active {
    fill: #fff;
}

.cls-5 {
    opacity: 0;
    cursor: pointer;
}

.cls-6 {
    fill: #fff;
}

.areaContents {
    position: relative;
    padding-top: 10rem;
}

.areaContents h3 {
    color: #fff;
    background: #ffb400;
    font-size: 4rem;
    font-weight: 700;
    text-align: center;
    padding: 1rem;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
}

.areaContents h4 {
    color: #ffb400;
    font-size: 2.2rem;
    font-weight: 500;
    line-height: 1.5em;
    padding-left: 10px;
    border-left: 10px solid #ffb400;
    margin-top: 1em;
    margin-bottom: .5em;
    letter-spacing: .04em;
}

.area_inner {
    text-align: left;
}

.area_inner .flex {
    display: flex;
    justify-content: space-between;
}

.area_inner .col2 {
    width: 49%;
}

.area_inner ul li {
    font-size: 1.6rem;
}

@media screen and (max-width: 749px) {
    #sec04 .ttl02 {
        margin-bottom: 4rem;
    }
    .sec04_list {
        display: flex;
        flex-wrap: wrap;
        justify-content: flex-start;
        margin-bottom: 4rem;
    }
    .sec04_list li {
        width: 31%;
        margin-bottom: 4rem;
        margin-right: 3.5%;
        background: #fff;
        font-size: 4rem;
        padding: 3rem;
        text-align: center;
        box-shadow: 1vw 1vw .5vw 0 rgba(153, 153, 153, 0.2);
    }
    .sec04_list li:nth-child(3n+3) {
        margin-right: 0;
    }
    .areaContents {
        padding-top: 10rem;
    }
    .areaContents h3 {
        font-size: 5rem;
        padding: 2rem;
    }
    .areaContents h4 {
        font-size: 4rem;
        padding-left: 2vw;
        border-left: 2vw solid #ffb400;
        margin-top: 1em;
        margin-bottom: .5em;
    }
    .area_inner ul li {
        font-size: 2.8rem;
    }
}


/*試験会場*/

.sec05_box {
    margin-bottom: 4rem;
    display: flex;
    justify-content: space-between;
}

.sec05_box .image {
    width: 38%;
}

.sec05_box .detail
{
    width			: 60%;
    background-color: #fff;
    padding			: 1.5rem;
    counter-reset	: number 0;
}

.sec05_box .detail dt {
    font-size: 1.8rem;
    line-height: 2rem;
    font-weight: 700;
    color: #ee86b4;
    position: relative;
    padding-left: 2rem;
}

.sec05_box .detail dt::before {
    counter-increment: number 1;
    content: counter(number);
    font-size: 1.2rem;
    line-height: 1.8rem;
    color: #fff;
    border-radius: 50%;
    text-align: center;
    width: 1.8rem;
    height: 1.8rem;
    background: #ee86b4;
    position: absolute;
    left: 0;
    top: .1em;
}

.sec05_box .detail dd {
    font-size: 1.3rem;
    color: #666;
    margin-top: .2em;
    margin-left: .5em;
    margin-bottom: .5em;
}

@media screen and (max-width: 749px) {
    #sec05 .ttl02 {
        margin-bottom: 4rem;
    }
    .sec05_box {
        margin-bottom: 4rem;
        display: block;
        justify-content: space-between;
    }
    .sec05_box .image {
        margin: auto auto 4rem;
    }
    .sec05_box .img01 {
        width: 90%;
    }
    .sec05_box .img02 {
        width: 80%;
    }
    .sec05_box .detail {
        width: 100%;
        padding: 4vw;
    }
    .sec05_box .detail dt {
        font-size: 3.6rem;
        line-height: 4rem;
        padding-left: 4.5rem;
    }
    .sec05_box .detail dt::before {
        font-size: 2.4rem;
        line-height: 4rem;
        width: 4rem;
        height: 4rem;
        left: 0;
        top: .1em;
    }
    .sec05_box .detail dd {
        font-size: 3rem;
        margin-bottom: 1em;
    }
}


/*モーダル*/

.remodalContents {
    max-width: 690px;
    padding: 0;
    max-height: calc(100vh - 150px);
}

.remodal_block {
    position: relative;
    max-height: calc(100vh - 150px);
    overflow-y: auto;
    padding: 10rem 2rem 2rem;
}

.remodal-closeBtn::before {
    content: '';
    width: 43px;
    height: 43px;
    background-image: url(../img/modal_close.png);
    background-size: contain;
    position: absolute;
    right: calc(50% - 345px);
    top: -60px;
    cursor: pointer;
}

@media screen and (max-width: 749px) {
    .remodalContents {
        max-height: 75vh;
    }
    .remodal_block {
        max-height: 75vh;
        padding: 12rem 4rem 4rem;
    }
    .remodal-closeBtn::before {
        width: 4vh;
        height: 4vh;
        right: 0;
        top: -5vh;
    }
}

/* 2022/04/20 custom */

#mv_pc_only{
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    overflow: hidden;
    min-height: 800px;
    z-index: -1;
}
#mv_pc_only video{
    position: absolute;
    width:100%;
    height:100%;
    object-fit:cover;
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
    min-width: 100%;
    min-height: 100%;
}
@media screen and (max-width: 1200px) {
    #mv_pc_only{
        display: none;
    }
}
@media screen and (min-width: 1201px) {
    #container{
        padding-top: 58px;
        overflow: hidden;
    }
    #header #mv{
        display: none;
        z-index: -1;
    }
    #header{
        width: 100%;
        z-index: 2;
    }
    #header .txt{
        font-size: 2.5rem;
    }
    #header .logo{
        width: 750px;
        left: 0;
        right: 0;
        margin: auto;
        opacity: 0;
        /* transform: translateY(40px); */
    }
    .header_menu,
    .menu_close{
        display: block;
    }
    #header .header_menu{
        position: fixed;
        top: 0;
        right: 0;
        z-index: 10;
        width: 50px;
        cursor: pointer;
    }
    #menu {
        position: fixed;
        width: 220px;
        background-position: right 5%;
        right: 0;
        top: 0;
        z-index: 10000;
        transform: translateX(220px);
        transition: .3s;
    }
    #menu.open {
        transform: translateX(0);
    }
    #menuBg {
        content: '';
        position: fixed;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        background: #000;
        display: block;
        z-index: 9999;
        opacity: .4;
        display: none;
    }
    #menu.open+#menuBg {
        display: block;
    }
    #menu .menu_close {
        cursor: pointer;
        position: absolute;
        right: 0;
        top: 0;
        width: 50px;
        height: 50px;
    }
    #contents {
        width: 750px;
        margin: 0 auto;
        background: #fff;
        position: relative;
        opacity: 0;
        z-index: 8;
        /* transform: translateY(40px); */
    }
}
@media screen and (min-width: 1450px) {
    #container{
        padding-top: 66px;
    }
}

body.mv_pc_end #header .logo{
    animation: pc_videoPlay 1.6s 3.4s both;
}
body.mv_pc_end #contents {
    animation: pc_videoPlay 1.6s 3.8s both;
}
@keyframes pc_videoPlay{
    0%{
        opacity: 0;
        transform: translateY(40px);
    }
    100%{
        opacity: 1;
        transform: translateY(0);
    }
}


/* @media screen and (min-width: 1201px) {
    #header .logo{
        position: fixed;
        box-shadow: 0 1px 2px 0 rgba(0, 0, 0, .1);
    }
    #container #contents{
        width: 750px;
        margin: 80px auto 0;
    }
    #menu,
    #header{
        width: calc(50% - 375px);
        min-width: 225px;
    }
    #header{
        z-index: 2;
    }
    #header .txt{
        padding: 0 .75em;
    }
    #header .txt span{
        display: block;
    }
    #menu .nav{
        margin-top: 80px;
    }
} */