/*==================================================
共通設定
===================================*/
:root{
 /*本文テキ スト_色*/
  --text_color: #4c2d15;
  --text_color_rgb: rgb(76,45,21);
  --text_color_thin: #7e6320;
  --text_color_thin_rgb: rgb(126,99,32);
 /*ビジネス社会学科＿色*/
  --color_bsns: #00a3df;
  --color_bsns_rgb: rgb(0,163,223);
  --color_bsns_thin: #ddf5ff;
  --color_bsns_thin_rgb: rgb(221,245,255);
 /*製菓学科＿色*/
  --color_conf: #ee781f;
  --color_conf_rgb: rgb(238,120,31);
  --color_conf_thin: #fff3e4;
  --color_conf_thin_rgb: rgb(255,243,228);
 /*歯科衛生学科＿色*/
  --color_dental: #2bb7b3;
  --color_dental_rgb: rgb(43,183,179);
  --color_dental_thin: #d5f1f0;
  --color_dental_thin_rgb: rgb(213,241,240);
 /*文字色・あしらい色*/
  --color_pink01: #ed1e79;
  --color_pink01_rgb: rgb(237,30,121);
  --color_pink02: #f97aab;
  --color_pink02_rgb: rgb(249,122,171);
  --color_pink03: #ffc0d8;
  --color_pink03_rgb: rgb(255,192,216);
  --color_pink04: #ffeef6;
  --color_pink04_rgb: rgb(255,238,246);
  --color_coral01: #ff8155;
  --color_coral01_rgb: rgb(255,129,85);
  --color_coral02: #ffe0de;
  --color_coral02_rgb: rgb(255,224,222);
  --color_coral03: #ffeeee;
  --color_coral03_rgb: rgb(255,238,238);
  --color_yellow01: #fdce30;
  --color_yellow01_rgb: rgb(253,206,48);
  --color_yellow02: #fdd000;
  --color_yellow02_rgb: rgb(253,208,0);
  --color_yellow03: #f9f065;
  --color_yellow03_rgb: rgb(249,240,101);
  --color_yellow04: #ffefc2;
  --color_yellow04_rgb: rgb(255,239,194);
  --color_blue01: #2e3192;
  --color_blue01_rgb: rgb(46,49,146);
  --color_blue02: #3368b5;
  --color_blue02_rgb: rgb(51,104,181);
  --color_blue03: #29abe2;
  --color_blue03_rgb: rgb(41,171,226);
  --color_blue04: #84bae5;
  --color_blue04_rgb: rgb(132,186,229);
  --color_blue05: #dce7ff;
  --color_blue05_rgb: rgb(220,231,255);
  --color_purple01: #f3ebff;
  --color_purple01_rgb: rgb(243,235,255);
  --color_green01: #93dfe2;
  --color_green01_rgb: rgb(147,223,226);
  --color_green02: #d9eddd;
  --color_green02_rgb: rgb(217,237,221);
  --color_green03: #e6f4ea;
  --color_green03_rgb: rgb(230,244,234);	
 /*フォント種類*/
  --font-Zen-Kaku-Gothic-New: "Zen Kaku Gothic New", serif;
	 --font-Kiwi-Maru: "Kiwi Maru", serif;
	 --font-Rajdhani: "Rajdhani", serif;/*数字だけ*/
  --font-style-normal: normal;
  --font-weight-light: 300;
  --font-weight-regular: 400;
  --font-weight-medium: 500;
  --font-weight-SemiBold: 600;
  --font-weight-bold: 700;
  --font-weight-black: 900;
	/*切り抜きsvg*/
  --top_mask_svg: url("/college/jyukensei/images/event/oc2025/oc2025_top_title-back_mask.svg");
  --box_mask_svg: url("/college/jyukensei/images/event/oc2025/oc2025_top_event-box_mask.svg");
  --schedule_mask_svg: url("/college/jyukensei/images/event/oc2025/oc2025_top_schedule_mask.svg");
  --pickup_mask_svg: url("/college/jyukensei/images/event/oc2025/oc2025_top_pickup_mask.svg");
}

/*--文字を非表示（logoなど）--*/
.text-hide {
text-indent: 100%;
white-space: nowrap;
overflow: hidden;
}
/*--強制的に改行--*/
span.kaigyou {
display: inline-block;
position: relative;
}
/*--flex_center(縦横センター)--*/
.flex_center{
display: flex;
justify-content: center;
align-items: center;
}
/*--パンくずnav--*/
.breadcrumb{
z-index: 2;
position: relative;
margin-bottom: 0;
}

/*==================================================
全体背景色
===================================*/
section.oc_wrapper{
position: relative;
}
section.oc_wrapper:before{
content:'';
display: block;
width: 100%;
height: 100%;
position: fixed;
top: 0;
left: 0;
background: url(/college/jyukensei/images/event/oc2026/oc2026_backskin_star.webp) repeat left / 50%, url(/college/jyukensei/images/event/oc2026/oc2026_backskin_slash.webp) repeat left / 50%, #fffddc;
}

/*==================================================
PCコンテンツ
===================================*/
/*--pcコンテンツ--*/
section.pc-content{
width: 30%;
max-width: 30%;
height: 100%;
display: block;
position: fixed;
top: 0;
}
@media screen and (max-width:801px){
section.pc-content{
display: none;		
}
}
/*==左==*/
section.pc-content.pc-content_left{
left: 0;
}
section.pc-content.pc-content_left div {
display: flex;
position: absolute;
width: 80%;
height: 300px;
bottom: 0;
left: 50%;
transform: translate(-50%, -20%);
-webkit-transform: translate(-50%, -20%);
-ms-transform: translate(-50%, -20%);
justify-content: space-around;
flex-direction: row;
flex-wrap: wrap;
}
/*--入試情報、目短チャレンジ、奨学金ボタン--*/
section.pc-content.pc-content_left div a:not(.booking-btn){
width: 32%;
height: 80px;
padding: 10px 0 15px;
display: flex;
justify-content: center;
align-items: end;
text-decoration: none;
color: var(--text_color);
cursor: pointer;
border-radius: 10px;
font-weight: 800;
position: relative;
margin-bottom: 2em;
}
section.pc-content.pc-content_left div a:not(.booking-btn):before {
content: '';
display: block;
position: absolute;
width: 30%;
height: 50%;
mask: url(/college/jyukensei/images/event/oc2026/oc2026_nav_clip.svg) no-repeat center / contain;
background: var(--color_blue02);
top: -3px;
left: 0;
}
section.pc-content.pc-content_left div a:nth-child(1) {
background: var(--color_green01);
}
section.pc-content.pc-content_left div a:nth-child(2) {
background: var(--color_yellow02);
}
section.pc-content.pc-content_left div a:nth-child(3) {
background: var(--color_blue04);
}
/*--予約ボタン--*/
section.pc-content.pc-content_left div a.booking-btn {
width: 100%;
height: 200px;
aspect-ratio: 1 / 1;
background: url(/college/jyukensei/images/event/oc2026/oc2026_nav-booking.webp) no-repeat center / contain;
filter: drop-shadow(1px 3px 3px #B6C0C8);
}
@media screen and (max-width: 1420px){
	section.pc-content.pc-content_left div{
	display: none;
	}
}

/*==右==*/
section.pc-content.pc-content_right{
right: 0;
}
/*--右側ナビゲーションボタン--*/
section.oc_right_inner div.oc_nav{
display: block;
position: absolute;
width: 60%;
height: 100%;
top: 25%;
left: 50%;
transform: translateX(-50%);
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
padding-bottom: 10%;
transition-duration: .6s;
opacity: 0;
}
/*このクラスが付与されると表示する*/
section.oc_right_inner div.oc_nav.fixed{
opacity: 1;
z-index: 30;
}
section.oc_right_inner div.oc_nav div {
display: flex;
flex-direction: column;
align-items: center;
justify-content: space-between;
width: 100%;
max-width: 100%;
height: auto;
position: -webkit-sticky;
position: sticky;
top: 0;
left: 0;
padding-bottom: 50px;
z-index: 80;
}
div.oc_nav div a {
width: 100%;
background:no-repeat center / contain;
cursor: pointer;
height: 100px;
}
/*navボタン*/
div.oc_nav div a.nav-logo{
width: 100%;
height: auto;
mask-position: center center;
mask-repeat: no-repeat;
mask-size: contain;
mask-image: url(/college/jyukensei/images/event/oc2026/oc2026-title.svg);
aspect-ratio: 174 / 97;
background: var(--color_pink01);
}
div.oc_nav div a.nav01{
background-image:url(/college/jyukensei/images/event/oc2025/oc2025_navbtn01_deco.webp);
}
div.oc_nav div a.nav02{
background-image:url(/college/jyukensei/images/event/oc2025/oc2025_navbtn02_deco.webp);
}
div.oc_nav div a.nav03{
background-image:url(/college/jyukensei/images/event/oc2025/oc2025_navbtn03_deco.webp);
}
div.oc_nav div a.nav04{
background-image:url(/college/jyukensei/images/event/oc2025/oc2025_navbtn04_deco.webp);
}
@media screen and (max-width: 1420px) and (orientation: landscape) {
section.oc_right_inner div.oc_nav, section.pc-content.pc-content_left div{
display: none;
}
}

/*==================================================
スクロールコンテンツ
===================================*/
/*--スクロールコンテンツ--*/
section.scroll-content.oc_main_wrapper {
display: block;
height: 100%;
width: 40%;
min-width: 800px;
background-color: var(--color_coral02);
margin: 0 auto;
z-index: 1;
position: relative;
contain: paint;
color: var(--text_color);
filter: drop-shadow(1px 3px 5px #A0A093);
}
@media screen and (max-width:800px){
section.scroll-content.oc_main_wrapper {
width: 100%;
min-width: 100%;
}
}

/*--ナビゲーションボタン（表示設定）--*/
div.nav_inner {
display: none;
}
@media screen and (max-width: 1420px) {
div.nav_inner {
display: block;
width: 100%;
max-width: 800px;
position: fixed;
/*top: 83.5%;*/
bottom: 0.1%;
left: 50%;
transform: translateX(-50%);
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
z-index: -1;
transition-duration: .6s;
opacity: 0;
}
/*このクラスが付与されると表示する*/
div.nav_inner.fixed{
opacity: 1;
z-index: 200;
}
div.nav_inner > div {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
width: 100%;
height: auto;
background: #ffffff;
}
div.nav_inner > div a {
width: calc(100% / 4);
height: 60px;
cursor: pointer;
justify-content: center;
align-items: center;
text-decoration: none;
color: unset;
}
/*--navボタン（背景色）--*/
section.oc_nav_sp div.nav_inner > div a:nth-of-type(odd){
background-color: var(--color_blue02);
}
section.oc_nav_sp div.nav_inner > div a:nth-of-type(even){
background-color: var(--color_pink03);
}
div.nav_inner > div a:nth-of-type(5), div.nav_inner > div a:nth-of-type(6), div.nav_inner > div a:nth-of-type(7) {
width: 33.333%;
display: flex;
justify-content: center;
align-items: center;
color: #ffffff;
border-top: solid 2px #ffffff;
font-weight: bold;
}
section.oc_nav_sp div.nav_inner > div a:nth-of-type(5) {
background-color: var(--color_green01);
}
section.oc_nav_sp div.nav_inner > div a:nth-of-type(6) {
background-color: var(--color_yellow02);
}
section.oc_nav_sp div.nav_inner > div a:nth-of-type(7) {
background-color: var(--color_blue04);
}
section.oc_nav_sp div.nav_inner > div a.booking-btn {
background-color: unset;
display: block;
position: absolute;
top: -170px;
height: 150px;
width: 150px;
right: 1em;
aspect-ratio: 1 / 1;
filter: drop-shadow(1px 3px 3px #B6C0C8);
}
}
@media screen and (max-width: 800px){
div.nav_inner.fixed{
z-index: 30;
}
}
/*--navボタン（文字:共通）--*/
div.nav_inner > div a.nav01 {
background: url(/college/jyukensei/images/event/oc2025/oc2025_navbtn01.webp) no-repeat center / contain;
}
div.nav_inner > div a.nav02 {
background: url(/college/jyukensei/images/event/oc2025/oc2025_navbtn02.webp) no-repeat center / contain;
}
div.nav_inner > div a.nav03 {
background: url(/college/jyukensei/images/event/oc2025/oc2025_navbtn03.webp) no-repeat center / contain;
}
div.nav_inner > div a.nav04 {
background: url(/college/jyukensei/images/event/oc2025/oc2025_navbtn04.webp) no-repeat center / contain;
}
div.nav_inner > div a.booking-btn {
background: url(/college/jyukensei/images/event/oc2026/oc2026_nav-booking.webp) no-repeat center / contain;
}
	
@media screen and (max-width: 800px){
div.nav_inner > div a.nav01 {
background: url(/college/jyukensei/images/event/oc2025/oc2025_navbtn01_sp.webp) no-repeat center / contain;
}
div.nav_inner > div a.nav02 {
background: url(/college/jyukensei/images/event/oc2025/oc2025_navbtn02_sp.webp) no-repeat center / contain;
}
div.nav_inner > div a.nav03 {
background: url(/college/jyukensei/images/event/oc2025/oc2025_navbtn03_sp.webp) no-repeat center / contain;
}
div.nav_inner > div a.nav04 {
background: url(/college/jyukensei/images/event/oc2025/oc2025_navbtn04_sp.webp) no-repeat center / contain;
}
/*div.nav_inner > div a.booking-btn {
background: url(/college/jyukensei/images/event/oc2026/oc2026_nav-booking.webp) no-repeat center / contain;
}*/
}

/*--title以降のsection--*/
section.main_inner {
padding: 80px 50px;
margin: 0 auto;
height: auto;
position: relative;
}
@media screen and (max-width:540px){
section.main_inner {
padding: 80px 15px;
}
}

/*--title以降のsection区切り（共通）--*/
section.main_inner:before {
content: '';
display: block;
position: absolute;
width: calc(100% + 25%);
height: 500px;
top: 0;
left: 50%;
transform: translateX(-50%);
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
mask:url(/college/jyukensei/images/event/oc2026/oc2026_backskin_top.svg) no-repeat top / contain;
z-index: -1;
}
section.main_inner > p {
width: calc(60% + 50px);
text-align: center;
margin: 0 auto;
font-size: 1.3rem;
font-weight: var(--font-weight-SemiBold);
}
@media screen and (max-width:540px){
/*--title以降のsection区切り（共通）--*/
section.main_inner:before {
height: 350px;
}
section.main_inner > p {
width: calc(80% + 50px);
}
}
@media screen and (max-width:480px){
/*--title以降のsection区切り（共通）--*/
section.main_inner:before {
height: 250px;
top: 0;
}
}

/*--ボタンスタイル--*/
a.switch {
color: unset;
text-decoration: unset;
display: flex;
justify-content: center;
align-items: center;
width: calc(80% - 10px);
margin: 10px auto 0;
padding: 5px 1em;
background: #ffffff;
border-radius: 20px;
border: solid 2px var(--text_color);
overflow: hidden;
position: relative;
cursor: pointer;
font-weight: var(--font-weight-black);
}
a.switch::after {
background: var(--color_pink03);
position: absolute;
top: 0;
left: 0;
content: '';
width: 100%;
height: 100%;
transform: scale(0, 1);
transform-origin: left top;
transition: .2s cubic-bezier(0.45, 0, 0.55, 1);
z-index: -1;
}
/*a.switch:hover {
color: #fff;
}*/
a.switch:hover::after {
transform: scale(1, 1);
}
i.r-arrow {
display: inline-block;
padding-left: 0.5em;
}
i.r-arrow:before {
content: '';
display: block;
width: 1em;
height: 1em;
background: url(/college/jyukensei/images/event/oc2025/icon_r-arrow.svg) no-repeat center / contain;
vertical-align: middle;
margin-top: -7px;
position: absolute;
top: 50%;
right: 12px;
}
@media screen and (max-width: 540px){
a.switch{
background:#ffffff;
color: var(--text_color);
}
a.switch::after {
display: unset;
}
}
@media screen and (max-width: 480px){
a.switch {
width: 100%;
}
}

/*--topビジュアル--*/
section.scroll-content.oc_main_wrapper section.main_top {
display: block;
position: relative;
width: 100%;
height: auto;
margin: 0 auto;
aspect-ratio: 1 / 1;
}
section.scroll-content.oc_main_wrapper section.main_top:before {
content: '';
display: block;
position: absolute;
width: 100%;
height: 100%;
background-color: rgba(143,54,0,0.20);
z-index: 3;
}
section.scroll-content.oc_main_wrapper section.main_top .top-mask {
width: 100%;
height: 100%;
overflow: hidden;
}
section.scroll-content.oc_main_wrapper section.main_top .js_swiper-container {
display: block;
width: 100%;
height: 100%;
position: relative;
margin: 0 auto;
z-index: 1;
}
section.scroll-content.oc_main_wrapper section.main_top div.swiper-wrapper{
width: 100%;
height: 100%;
}
section.scroll-content.oc_main_wrapper section.main_top div.swiper-wrapper figure{
width: 100%;
height: 100%;
}
section.scroll-content.oc_main_wrapper section.main_top div.swiper-wrapper figure img {
object-fit: cover;
width: 100%;
height: 100%;
}
/*タイトルロゴ*/
section.main_top h2{
display: block;
width: 60%;
height: auto;
aspect-ratio: 696 / 425;
position: absolute;
mask-position: center center;
mask-repeat: no-repeat;
mask-size: contain;
mask-image: url(/college/jyukensei/images/event/oc2026/oc2026-title.svg);
background: #ffffff;
bottom: 2em;
left: 2em;
z-index: 5;
}

/*--TOP以降のタイトルh3共通設定--*/
section.main_inner h3 {
display: block;
position: relative;
width: 100%;
height: 200px;
}
@media screen and (max-width: 540px){
section.main_inner h3 {
width: calc(100% + 30px);
height: 120px;
left: 50%;
transform: translateX(-50%);
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
}
}

/*--/ 注目のイベント /--*/
@media screen and (max-width: 800px){
section#featured_event.main_inner{
padding-top: 30px;
}
}
/*タイトル*/
section#featured_event h3{
background: url(/college/jyukensei/images/event/oc2025/oc2025_top_title_01_featured-event.webp) no-repeat center / contain;
}
/*スライダー設定*/
section#featured_event div.beside_slider {
width: 100%;
height: auto;
position: relative;
}
section#featured_event div.beside_slider:before,
section#featured_event div.beside_slider:after {
content: '';
display: block;
position: absolute;
background: url(/college/jyukensei/images/event/oc2025/oc2025_top_title_garland.webp) no-repeat center / contain;
width: clamp(11.25rem, 8.333rem + 14.58vw, 15.625rem);
height: clamp(11.25rem, 8.333rem + 14.58vw, 15.625rem);
top: -100px;
z-index: 1;
}
section#featured_event div.beside_slider:before {
left: -50px;
}
section#featured_event div.beside_slider:after {
right: -50px;
transform: rotate(45deg);
}
section#featured_event div.beside_slider .slick-slider{
height: 100%;
}
@media screen and (max-width: 540px){
section#featured_event div.beside_slider:before {
left: -100px;
}
section#featured_event div.beside_slider:after{
right: -100px;
	}
}
/*注目イベント（list-box:画像はページ内cssで設定）*/
section#featured_event .beside_slider .list-box{
padding: 10px;
height: 100%;
width: 100%;
display: flex;
flex-direction: column;
}
section#featured_event .beside_slider .list-box a {
text-decoration: none;
color: unset;
cursor: pointer;
display: block;
}
section#featured_event .beside_slider .list-box a.no_link {
text-decoration: none;
color: unset;
cursor: none;
display: block;
}
section#featured_event .beside_slider .list-box .list-inner{
position: relative;
overflow: hidden;
margin: 30px auto 0;
padding: 0 0 10px;
border-radius: 25px;
background-color: #ffffff;
min-height: 250px;
aspect-ratio: 16 / 9;
box-shadow: #c48c8c 3px 3px 5px;
}
/*注目イベント（終了後）タイマー処理できるか調整中*/
@media screen and (max-width: 540px){
section#featured_event .beside_slider .list-box .list-inner{
margin: 30px 0 0;
min-height: 200px;
}
}
@media screen and (max-width: 480px){
section#featured_event .beside_slider .list-box .list-inner{
aspect-ratio: 1 / 1;
}
}
/*注目イベント（日程）*/
section#featured_event .beside_slider .list-box p.date{
width: 100%;
height: auto;
font-size: clamp(4.5rem, 3.5rem + 5vw, 6rem);
font-family: var(--font-Rajdhani);
font-style: var(--font-style-normal);
font-weight: var(--font-weight-bold);
color: var(--color_pink01);
line-height: 1em;
filter: drop-shadow(3px 3px 0 #ffffff);
}
section#featured_event .beside_slider .list-box p.date.term{
font-size: clamp(2rem, 10vw, 5rem);
margin-top: 1rem;
}
/*注目イベント（時間）*/
section#featured_event .beside_slider .list-box p.time{
width: 100%;
height: 1rem;
font-size: clamp(1.5rem, 1.167rem + 1.67vw, 2rem);
font-family: var(--font-Rajdhani);
font-style: var(--font-style-normal);
font-weight: var(--font-weight-bold);
color: var(--color_pink01);
line-height: 1em;
filter: drop-shadow(2px 2px 0 #ffffff);
}
p.course {
width: calc(11em + 10px);
height: auto;
padding: 2px 8px;
background: #cccccc;
color: #ffffff;
border-radius: 10px;
margin: 15px auto;
font-weight: var(--font-weight-black);
text-align: center;
}
p.course.bsns{
background:var(--color_bsns);
}
p.course.conf{
background:var(--color_conf);
}
p.course.dental{
background:var(--color_dental);
}
p.course.oc{
background:var(--color_yellow01);
}
p.course.other{
background:var(--color_pink01);
}
.list-inner.flex_center p:last-child {
padding-bottom: 5px;
letter-spacing: -0.05rem;

line-height: 1em;
font-size: 1rem;
}
@media screen and (max-width: 540px){
section#featured_event .beside_slider .list-box p.date.term{
font-size: clamp(2rem, 10vw, 5rem);
margin: 1.7rem 0;
line-height: 2rem;
}
section#featured_event .beside_slider .list-box p.time {
width: 100%;
height: 2rem;
line-height: 1em;
flex-direction: column;
}
}

/*--/ スケジュール /--*/
section#schedule {
position: relative;
z-index: 5;
padding-top: 80px;
}
/*区切り*/
section#schedule.main_inner:before {
background:var(--color_purple01);
}
/*タイトル*/
section#schedule h3{
background: url(/college/jyukensei/images/event/oc2025/oc2025_top_title_02_schedule.webp) no-repeat center / contain;
}
/*絞り込みボタン*/
.m_nav_b{
width: 100%;
max-width: 800px;
margin: 0 auto;
position: relative;
}
.m_nav_b .btn {
display: flex;
justify-content: space-around;
margin-bottom: 25px;
width: 100%;
}
.m_nav_b .btn a {
margin: 10px 5px;
padding: 10px;
width: calc(100% / 4);
display: flex;
justify-content: center;
align-items: center;
}
.m_nav_b .btn a:before {
display: none;
}
/*絞り込みボタン背景色*/
.m_nav_b:before {
content: '';
display: block;
position: absolute;
width: calc(100% + 50%);
height: calc(100% + 100px);
background: linear-gradient(180deg, var(--color_purple01) 0%, #ffffff 50%, var(--color_coral02) 100%) no-repeat center;
left: 50%;
transform: translateX(-50%);
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
}
@media screen and (max-width: 540px){
.m_nav_b .btn {
display: flex;
justify-content: space-around;
margin-bottom: 25px;
width: 100%;
flex-wrap: wrap;
}
.m_nav_b .btn a.all {
width: 100%;
margin-bottom: 0;
}
.m_nav_b .btn a:not(.all) {
width: calc(100% / 3.2);
margin: 10px 2px;
}
}
@media screen and (max-width: 480px){
.m_nav_b .btn a {
padding: 10px 5px;
}
/*絞り込みボタン背景色*/
.m_nav_b:before {
top: -5%;
z-index: -1;
}
}
/*日程一覧*/
section#schedule ul.list{
width:100%;
max-width: 800px;
height: auto;
margin: 0 auto;
display: flex;
flex-wrap: wrap;
justify-content: space-around;
padding-bottom: 50px;
}
section#schedule ul.list li{
width: 200px;
height: 200px;
padding: 3px;
filter: drop-shadow(1px 2px 2px #c0c0c0);
text-align: center;
margin-bottom: 30px;
overflow: hidden;
}
section#schedule ul.list li a{
display: block;
width: 100%;
height: 100%;
color: unset;
position: relative;
text-decoration: none;
background-color: #ffffff;
border-radius: 15px;
}
section#schedule ul.list li div.event_day {
height: 80%;
position: relative;
text-align: center;
mask-image: var(--schedule_mask_svg);
mask-repeat: no-repeat;
mask-position: center bottom;
mask-size: 145%;
display: flex;
flex-direction: column;
align-items: center;
justify-content: space-between;	
z-index: 1;
padding: 1em 0 2em;
border-radius: 15px 15px 0 0;
}
section#schedule ul.list li div.event_day:before{
content: '';
display: block;
position: absolute;
width: 60%;
height: 60%;
background: no-repeat center / contain;
top: 50%;
transform: translateY(-50%);
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
z-index: -1;
}
section#schedule ul.list li div.event_day p.organizer{
width: calc(10em + 5px);
height: auto;
padding: 2px 8px;
background: #cccccc;
color: #ffffff;
font-weight: var(--font-weight-bold);
border-radius: 10px;
}
/*終了イベント*/
section#schedule ul.list li.switch_timer.end a:before {
content: '';
display: block;
position: absolute;
width: 100%;
height: 100%;
background: rgba(64,64,64,0.6);
z-index: 2;
border-radius: 15px;
}
section#schedule ul.list li.switch_timer.end a:after {
content: '終了しました';
display: block;
position: absolute;
width: 100%;
height: 2em;
z-index: 2;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
font-size: 1.8em;
color: #ffffff;
font-weight: var(--font-weight-black);
font-family: var(--font-Zen-Kaku-Gothic-New);
}
section#schedule ul.list li.switch_timer.cancel.end a:after {
content: '開催中止';
}
/*オープンキャンパス*/
section#schedule ul.list li div.event_day.oc{
background-color:var(--color_yellow04);
}
section#schedule ul.list li div.event_day.oc:before{
background-image: url(/college/jyukensei/images/event/oc2025/oc2025_event-icon_oc.svg);
}
section#schedule ul.list li div.event_day.oc p.organizer{
background-color: var(--color_yellow01);
}
/*ビジネスイベント*/
section#schedule ul.list li div.event_day.bsns{
background-color:var(--color_bsns_thin);
}
section#schedule ul.list li div.event_day.bsns:before{
background-image: url(/college/jyukensei/images/event/oc2023_event-icon_bsns.svg);
}
section#schedule ul.list li div.event_day.bsns p.organizer{
background-color: var(--color_bsns);
}
/*製菓イベント*/
section#schedule ul.list li div.event_day.conf{
background-color:var(--color_conf_thin);
}
section#schedule ul.list li div.event_day.conf:before{
background-image: url(/college/jyukensei/images/event/oc2023_event-icon_conf.svg);
}
section#schedule ul.list li div.event_day.conf p.organizer{
background-color: var(--color_conf);
}
/*歯科衛生学イベント*/
section#schedule ul.list li div.event_day.dental{
background-color:var(--color_dental_thin);
}
section#schedule ul.list li div.event_day.dental:before{
background-image: url(/college/jyukensei/images/event/oc2023_event-icon_dental.svg);
}
section#schedule ul.list li div.event_day.dental p.organizer{
background-color: var(--color_dental);
}
/*その他イベント*/
section#schedule ul.list li div.event_day.other{
background-color:var(--color_pink03);
}
section#schedule ul.list li div.event_day.other p.organizer{
background-color: var(--color_pink01);
}
/*その他イベント（桐和祭）背景*/
section#schedule ul.list li div.event_day.festival:before {
width: 90%;
height: 90%;
background: no-repeat url(/college/jyukensei/images/campuslife/annual_schedule_2022_inner07_toukosan.png) bottom / contain;
opacity: 0.2;
}
section#schedule ul.list li div.event_day p.days {
display: flex;
justify-content: center;
align-items: center;
font-size: clamp(3.2rem, 3rem + 1vw, 3.5rem);
font-family: var(--font-Rajdhani);
font-style: var(--font-style-normal);
font-weight: var(--font-weight-bold);
}
section#schedule ul.list li div.event_day p.days.term {
font-size: 2.2rem;
flex-wrap: wrap;
}
section#schedule ul.list li div.event_day p.days span{
position: relative;
width: 1.8rem;
height: 1.8rem;
background: var(--text_color);
border-radius: 1rem;
margin-left: 2px;
font-size: 1.15rem;
color: #ffffff;
font-family: var(--font-Zen-Kaku-Gothic-New);
}
section#schedule ul.list li div.event_day p.days.term span {
width: 1.5rem;
height: 1.5rem;
font-size: 1rem;
}
section#schedule ul.list li div.event_day p.days.sun span,
section#schedule ul.list li div.event_day p.days.term span.sun{
background: var(--color_coral01);
}
section#schedule ul.list li div.event_day p.days.sat span,
section#schedule ul.list li div.event_day p.days.term span.sat{
background: var(--color_blue04);
}
section#schedule ul.list li div.event_day p.days span.holiday {
width: auto;
padding: 0 6px;
}
section#schedule ul.list li div:last-child {
height: 20%;
display: flex;
justify-content: center;
align-items: center;
}
section#schedule ul.list li div:last-child p {
line-height: 1.5rem;
font-weight: var(--font-weight-SemiBold);
}
section#schedule ul.list li div.event_day.festival div.event_details p { 
font-size: 1.5rem;
font-weight: var(--font-weight-SemiBold);
}
@media screen and (max-width: 540px){
section#schedule ul.list li {
margin-bottom: 15px;
}
section#schedule ul.list li div.event_day p.organizer{
font-size: 1rem;
}
}
@media screen and (max-width: 480px){
section#schedule ul.list li{
width: 50%;
}
section#schedule ul.list li div.event_day p.days.term {
font-size: 2rem;
}
section#schedule ul.list li div.event_day p.days.term span {
width: 1.3rem;
height: 1.3rem;
font-size: 0.85rem;
}
section#schedule ul.list li div.event_day:before {
width: 50%;
height: 50%;
}
section#schedule ul.list li div:last-child p {
line-height: 1.3rem;
font-size: 1rem;
}
}

/*--/ バナー /--*/
div.banner {
margin: 0 auto;
padding: 20px;
}
div.banner a {
text-indent: 100%;
white-space: nowrap;
overflow: hidden;
display: block;
width: 100%;
height: 100%;
cursor: pointer;
}
@media screen and (max-width: 540px){
div.banner {
padding: 0;
}
}
/*ステップアップセミナー*/
div.banner div.step-up {
display: block;
position: relative;
margin-bottom: 50px;
width: 100%;
height: clamp(6.25rem, 4.318rem + 9.66vw, 11.563rem);
background: url(/college/jyukensei/images/event/oc2025/oc2025_banner_stepup_01.webp) no-repeat center / contain;
}
div.stepup{
margin-bottom: 50px;
text-align: center;
}
div.stepup a {
background: url(/college/jyukensei/images/event/oc2024/oc2024_step-up_title_top-list.svg) no-repeat center / contain, #64d8cd;
display: block;
width: 80%;
margin: 0 auto;
height: 100px;
border-radius: 10px;
}
/*ステップアップセミナーpop-up*/
.mfp-wrap {
top: 4%;
height: calc(100% - 50px);
}
div#inline-wrap {
text-align: center;
padding-top: 4%;
position: relative;
margin: 110px auto 0;
max-width: 600px;
background: rgba(255, 255, 255, 0.8);
padding: 50px 20px 30px;
border-radius: 20px;
display: flex;
justify-content: space-around;
}
/*学生会館無料体験*/
div.banner div.dormy {
width: 100%;
height: clamp(7.188rem, 5.71rem + 7.39vw, 11.25rem);
background: url(/college/jyukensei/images/event/oc2025/oc2025_banner_dormi.webp) no-repeat center / contain;
position: relative;
}
div.dormy:before {
content: '';
display: block;
position: absolute;
width: clamp(3.125rem, 1.042rem + 10.42vw, 6.25rem);
height: clamp(3.125rem, 1.042rem + 10.42vw, 6.25rem);
background: url(/college/jyukensei/images/event/oc2025/oc2025_btn_anime_tourist.webp) no-repeat center / contain;
right: 6.5rem;
bottom: 20px;
}
@media screen and (max-width: 540px){
div.dormy:before {
right: 5rem;
}
}
@media screen and (max-width: 480px){
div.dormy:before {
right: 1rem;
}
}

/*--/ オープンキャンパスとは /--*/
section#what_oc {
position: relative;
z-index: 1;
padding-top: 80px;
}
section#what_oc:before {
background: #ffffff;
}
section#what_oc > h3 {
background: url(/college/jyukensei/images/event/oc2025/oc2025_top_title_03_what-oc.webp) no-repeat center / contain;
}
/*プログラム内容*/
section.program{
width: 100%;
height: auto;
padding-bottom: 250px;
position: relative;
}
section.program:before {
content: '';
display: block;
position: absolute;
width: calc(100% + 100px);
height: calc(100% + 100px);
background: #ffffff;
top: -5%;
left: 50%;
transform: translateX(-50%);
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
z-index: -1;
}
section.program ul{
display: flex;
flex-direction: column;
width: 100%;
height: auto;
margin-top: 50px;
padding: 20px;
position: relative;
}
section.program ul:before, section.program ul:after{
content: '';
display: block;
width: 100px;
height: 100%;
background: url(/college/jyukensei/images/event/oc2025/oc2025_what-oc_backskin.svg) no-repeat top / cover;
top: 0;
left: 0;
position: absolute;
z-index: -1;
}
section.program ul:after{
left: unset;
right: 0;
transform: scale(-1, -1);
top: 5rem;
}
/*縦ループ*/
/*@keyframes loop {
  0% {
    transform: translateX(100%);
  }
  to {
    transform: translateX(-100%);
  }
}
@keyframes loop2 {
  0% {
    transform: translateX(0);
  }
  to {
    transform: translateX(-200%);
  }
}*/
section.program li{
width: 100%;
height: auto;
position: relative;
}
section.program li div[class^="images"] {
display: block;
position: relative;
width: 60%;
height: auto;
aspect-ratio: 1 / 1;
border-radius: 50%;
background: no-repeat center / cover;
overflow: hidden;
}
section.program li:nth-of-type(even) div[class^="images"] {
margin-left: auto;
}
section.program li div:last-child {
width: 50%;
min-height: 140px;	
display: flex;
position: absolute;
flex-direction: column;
background: var(--color_conf_thin);
padding: 25px 20px;
border-radius: 10px;
right: 0;
top:50%;
transform: translateY(-50%);
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
filter: drop-shadow(1px 3px 3px #B6C0C8);
}
section.program li:nth-of-type(even) div:last-child {
right: unset;
background: var(--color_coral03);
}
section.program li div:last-child h4 {
text-align: center;
border-bottom: solid;
font-size: 1.5rem;
margin-bottom: 0.8rem;
}
section.program li div:last-child p {
padding: 0 10px 10px;
}
/*プログラム内容（説明会）*/
section.program li div.images01 {
background-image: url(/college/jyukensei/images/event/oc2026/oc2026_what-oc_img01.jpg);
}
span.whaOC_staff03{
display: block;
position: absolute;
width: auto;
height: clamp(20.625rem, 20.17rem + 2.27vw, 21.875rem);
aspect-ratio: 3 / 5;
background: url(/college/jyukensei/images/event/oc2026/oc2026_mt-staff08.webp) no-repeat center / contain;
left: -120px;
top: 15%;
}
/*プログラム内容（学び体験）*/
section.program li div.images02 {
background-image: url(/college/jyukensei/images/event/oc2026/oc2026_what-oc_img02.jpg);
}
span.whaOC_staff01{
display: block;
position: absolute;
width: auto;
height: clamp(20.625rem, 20.17rem + 2.27vw, 21.875rem);
aspect-ratio: 3 / 5;
background: url(/college/jyukensei/images/event/oc2026/oc2026_mt-staff02.webp) no-repeat center / contain;
right: -80px;
top: 0;
}
/*プログラム内容（個別相談）*/
section.program li div.soudan:before {
content: '';
display: block;
position: absolute;
width: 55%;
height: auto;
aspect-ratio: 1 / 1;
background: url(/college/jyukensei/images/event/oc2026/oc2026_mt-teachers.webp) no-repeat center / contain;
bottom: 30px;
left: 50%;
transform: translateX(-50%);
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
}
section.program li div.images03 {
background-image: url(/college/jyukensei/images/event/oc2026/oc2026_what-oc_img03.jpg);
}
section.program li div.soudan a.switch {
margin-top: 45%;
}
/*プログラム内容（在学生企画）*/
section.program li div.images04 {
background-image: url(/college/jyukensei/images/event/oc2026/oc2026_what-oc_img04.jpg);
}
span.whaOC_staff02{
display: block;
position: absolute;
width: auto;
height: clamp(20.625rem, 20.17rem + 2.27vw, 21.875rem);
aspect-ratio: 3 / 5;
background: url(/college/jyukensei/images/event/oc2026/oc2026_mt-staff03.webp) no-repeat center / contain;
right: -120px;
top: 15%;
}
/*切替の雲１*/
section.program:after {
content: '';
display: block;
position: absolute;
width: calc(100%* 2);
height: 410px;
background: url(/college/jyukensei/images/event/oc2025/oc2025_backskin_cloud_green02.svg) no-repeat center / contain;
bottom: -80px;
left: 50%;
transform: translateX(-50%);
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
filter: drop-shadow(2px -2px 6px #B6C0C8);
z-index: -1;
}
@media screen and (max-width: 800px){
section.program:before {
top: -8%;
}	
section.program li:nth-of-type(even) div:last-child {
right: unset;
margin-right: auto;
margin-left: unset;
backround: unset;
}
span.whaOC_staff01{
right: -90px;
top: 0;
}
span.whaOC_staff02{
right: -110px;
top: 120px;
}
}
@media screen and (max-width: 540px){
section.program ul{
margin-top: 0;
}
section.program li {
padding: 15px;
}
section.program li div:last-child,
section.program li:nth-of-type(even) div:last-child{
background: unset;
filter: unset;
color: #ffffff;
width: 85%;
left: 50%;
transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%,-50%);
}
section.program li div.soudan {
padding-bottom: 0;
}
/*section.program li div.soudan a.switch {
margin-top: 45%;
}*/
section.program li div.soudan:before {
bottom: 0;
background: url(/college/jyukensei/images/event/oc2026/oc2026_mt-teachers_white.webp) no-repeat center / contain;
}
section.program li div[class^="images"] {
display: block;
width: 100%;
}
section.program li div[class^="images"]:before{
content:'';
display: block;
position:absolute;
width: 100%;
height: 100%;
}
section.program li div.images01:before{
background-color: rgba(105,72,94,0.70);
}
section.program li div.images02:before{
background-color: rgba(125,122,78,0.70);
}
section.program li div.images03:before{
background-color: rgba(79,113,115,0.70);
}
section.program li div.images04:before{
background-color: rgba(65,99,58,0.70);
}
span.whaOC_staff02{
right: unset;
top: 180px;
left:50%;
transform: translateX(-50%);
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
}
span.whaOC_staff03 {
left:unset;
top: 55%;
right: -70px;
}
span.whaOC_staff01 {
right: unset;
top: 60%;
left: -95px;
}
}
@media screen and (max-width: 480px){
section.program{
padding-bottom: 200px;
}	
section.program:before {
top: -10%;
}
section.program:after {
bottom: -40px;
}
section.main_inner > p {
font-size: 1.2rem;
}
span.whaOC_staff01 {
right: -125px;
}
span.whaOC_staff02 {
top: 220px;
}
section.program li {
padding: 15px 0;
}
}
@media screen and (max-width:380px){
section.program li div.soudan a.switch {
margin-top: 35%;
}
}

/*--/ pickup 注目の制度 /--*/
section.pickup {
position: relative;
padding-bottom: 200px;
}
/*背景色*/
section.pickup ul:after {
width: calc(100% + 100px);
height: 100%;
background: var(--color_dental_thin);
content: '';
display: block;
position: absolute;
top: 0;
left: 50%;
transform: translateX(-50%);
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
z-index: -1;
}
/*タイトルあしらい*/
section.pickup h3, section.pickup h3 span {
display: block;
width: 70%;
height: 3rem;
line-height: 2.8rem;
padding-right: 5rem;
font-size: clamp(1.7rem, 1.591rem + 0.55vw, 2rem);
border-radius: 0 2rem 2rem 0;
position: absolute;
text-align: right;
font-family: var(--font-Zen-Kaku-Gothic-New);
left: -50px;
transform: unset;
}
/*タイトル（注目の制度）*/
section.pickup h3 {
background-color: var(--color_yellow04);
filter: drop-shadow(1px 1px 3px #B6C0C8);
top: -20px;
}
section.pickup h3:before {
content: '★';
display: inline-block;
width: 2rem;
height: 2rem;
color: var(--color_yellow02);
transform: rotate(45deg);
font-size: 2rem;
z-index: -1;
}
/*タイトル（PickUp）*/
section.pickup h3 span {
width: calc(70% - 2em);
background-color: var(--color_yellow02);
padding-right: 1.3rem;
filter: drop-shadow(1px 1px 3px #B6C0C8);
top: 0;
}
section.pickup h3 span:before {
content: '★';
display: inline-block;
position: relative;
width: 2rem;
height: 2rem;
color: var(--color_yellow04);
transform: rotate(45deg);
font-size: 2rem;
z-index: -1;
}
@media screen and (max-width: 800px){
section.pickup h3{
width: calc(80% + 2em)
}
}
@media screen and (max-width: 540px){
section.pickup h3 {
width: 100%;
padding-right: 1em;
left: -15px;
}
}
@media screen and (max-width: 480px){
section.pickup a.switch{
width: calc(85% + 5px);
}
}
/*制度詳細ボタン*/
section.pickup ul {
padding: 100px 0;
display: flex;
flex-direction: column;
margin: 0 10% 100px;
}
section.pickup li {
display: flex;
height: 150px;
align-items: center;
background-color: var(--color_yellow04);
border-radius: 15px;
filter: drop-shadow(1px 3px 3px #B6C0C8);
position: relative;
}
section.pickup li:first-child{
margin-bottom: 80px;
}
section.pickup li div:first-child {
width: 55%;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
height: 100%;
mask-image: var(--pickup_mask_svg);
mask-position: center;
mask-size: 100%;
background-color: var(--color_yellow01);
border-radius: 15px 0 0 15px;
}
section.pickup li div:first-child h4, section.pickup li div:first-child h5 {
font-family: var(--font-Zen-Kaku-Gothic-New);
}
section.pickup li div:first-child h4 {
font-size: clamp(1.5rem, 1.318rem + 0.91vw, 2rem);
font-weight: var(--font-weight-black);
}
section.pickup li div:first-child h5 {
position: relative;
padding: 0 1rem;
}
section.pickup li div:first-child h5:before, section.pickup li div:first-child h5:after {
content: '';
display: block;
position: absolute;
width: 2rem;
height: 2px;
background-color: var(--text_color);
bottom: 12px;
}
section.pickup li div:first-child h5:before {
left: -0.8rem;
transform: rotate(60deg);
}
section.pickup li div:first-child h5:after {
right: -0.8rem;
transform: rotate(-60deg);
}
section.pickup li:nth-of-type(even) {
flex-direction: row-reverse;
}
section.pickup li:nth-of-type(even) div:first-child {
transform: scale(-1, 1);
}
section.pickup li:nth-of-type(even) div:first-child h4,
section.pickup li:nth-of-type(even) div:first-child h5,
section.pickup li:nth-of-type(even) div:first-child a {
transform: scale(-1, 1);
}
div[class^="staff_voice"] {
width: 45%;
height: 100%;
position: relative;
}
div[class^="staff_voice"] img {
display: block;
max-width: 180px;
max-height: 180px;
position: absolute;
bottom: 0;
left: 50%;
transform: translateX(-50%);
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
}
@media screen and (max-width: 480px){
section.pickup ul {
margin: 0 1% 30px;
}
}
/*切替の雲2*/
section.pickup:after {
content: '';
display: block;
position: absolute;
width: calc(100%* 2);
height: 410px;
background: url(/college/jyukensei/images/event/oc2025/oc2025_backskin_cloud_coral.svg) no-repeat center / contain;
bottom: -140px;
left: 50%;
transform: translateX(-50%) rotateY(180deg);
-webkit-transform: translateX(-50%) rotateY(180deg);
-ms-transform: translateX(-50%) rotateY(180deg);
filter: drop-shadow(2px -2px 6px #B6C0C8);
z-index: -1;
}

/*--/ 在学生スタッフ /--*/
section.staff{
position: relative;
z-index: -1;
}
section.staff h3 {
position: absolute;
height: 230px;
background: url(/college/jyukensei/images/event/oc2025/oc2025_top_staff_logo.webp) no-repeat center / contain;
top: -290px;
left: 50%;
transform: translateX(-50%) rotate(-1deg);
-webkit-transform: translateX(-50%) rotate(-1deg);
-ms-transform: translateX(-50%) rotate(-1deg);
}
.metan-staff, .meji-suta{
height: auto;
position: relative;
z-index: 1;
}
.metan-staff > img, .meji-suta > img {
height: clamp(21.875rem, 20.057rem + 9.09vw, 26.875rem);
filter: drop-shadow(1px 3px 3px #B6C0C8);
}
.metan-staff h4,.meji-suta h4 {
width: 70%;
height: 75px;
position: absolute;
}
.staff-inner {
display: flex;
flex-direction: column;
align-items: center;
margin-top: -160px;
width: 100%;
height: auto;
position: relative;
}
.photo_frame {
background: no-repeat center / cover;
border: solid 10px #ffffff;
border-radius: 15px;
margin-bottom: -25px;
width: 90%;
height: auto;
aspect-ratio: 16 / 9;
overflow: hidden;
filter: drop-shadow(1px 3px 3px #B6C0C8);
}
.staff-inner p {
width: 75%;
padding: 15px;
background: #ffffff;
border-radius: 15px;
border: solid 8px var(--color_pink03);
font-size: 1.15rem;
filter: drop-shadow(1px 3px 3px #B6C0C8);
transform: rotate(2deg);
}
/*目短スタッフ*/
/*背景色*/
.metan-staff:before {
width: calc(100% + 100px);
height: calc(100% + 450px);
background: url(/college/jyukensei/images/event/oc2025/oc2025_backskin_shooting-star.svg) repeat,var(--color_coral02);
content: '';
display: block;
position: absolute;
top: 50px;
left: 50%;
transform: translateX(-50%);
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
z-index: -1;
}
.metan-staff > img {
margin: -80px 0 0 10%;
}
.metan-staff h4 {
background: url(/college/jyukensei/images/event/oc2025/oc2025_staff_metan_logo.webp) no-repeat center / contain;
top: 0;
right: -30px;
transform: rotate(-4deg);
}
.metan-staff .photo_frame {
background: url(/college/jyukensei/images/event/oc2026/oc2026_staff_metan-group.jpg) no-repeat bottom / 110%;
}
.meji-suta .photo_frame {
background-image: url(/college/jyukensei/images/event/oc2026/oc2026_staff_mejisuta-group.jpg);
}
@media screen and (max-width: 800px){
.metan-staff h4{
top:-5%;
}
.meji-suta h4 {
top: 10%;
}
}
/*切替の雲3*/
.metan-staff:after {
content: '';
display: block;
position: absolute;
width: calc(100%* 2);
height: 410px;
background: url(/college/jyukensei/images/event/oc2025/oc2025_backskin_cloud_green01.svg) no-repeat center / contain;
/*bottom: -600px;*/
left: 50%;
transform: translateX(-50%);
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
filter: drop-shadow(2px -2px 6px #B6C0C8);
z-index: -1;
}
/*メジ★スタ*/
.meji-suta:before {
content: '';
display: block;
position: absolute;
width: calc(100% + 100px);
height: calc(100% + 300px);
background: linear-gradient(180deg, var(--color_green01_rgb) 0%, var(--color_coral03_rgb) 100%) no-repeat center;
z-index: -1;
top: 300px;
left: 50%;
transform: translateX(-50%);
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
}
.meji-suta:after {
content: '';
display: block;
position: relative;
width: calc(100% + 100px);
height: calc(100% + 100px);
left: 50%;
background: url(/college/jyukensei/images/event/oc2025/oc2025_backskin_stars.svg);
transform: translateX(-50%);
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
z-index: -1;
}
.meji-suta > img {
margin-left: 48%;
}
.meji-suta h4 {
background: url(/college/jyukensei/images/event/oc2025/oc2025_staff_mejisuta_logo.webp) no-repeat center / contain;
top: 15%;
left: -30px;
transform: rotate(4deg);
}
.meji-suta .staff-inner:before {
content: '';
display: block;
position: absolute;
width: 100%;
height: 100%;
background: url(/college/jyukensei/images/event/oc2025/oc2025_backskin_shooting-star.svg) top;
top: -110px;
z-index: -1;
}
.meji-suta .staff-inner p {
border: solid 8px var(--color_blue04);
transform: rotate(-2deg);
}
@media screen and (max-width: 540px){
.meji-suta > img {
margin-left: 38%;
}
}
@media screen and (max-width: 480px){
.metan-staff, .meji-suta {
margin-bottom: 0;
}
.photo_frame {
width: 100%;
height: 200px;
}
.staff-inner p {
width: 90%;
}
.metan-staff > img {
margin: -100px 0 0 0;
}
.metan-staff h4 {
top: -10%;
right: -15px;
}
.meji-suta > img {
margin-left: 20%;
}
.meji-suta h4 {
top: 10%;
}
}

/*--/ Q&A /--*/
section#qa {
position: relative;
z-index: 1;
}
/*区切り*/
section#qa.main_inner:before {
background: var(--color_coral02);
z-index: -1;
}
section#qa h3 {
background: url(/college/jyukensei/images/event/oc2025/oc2025_top_title_04_qa.webp) no-repeat center / contain;
}
.accordion-wrapper{
margin: 40px auto 80px;
position: relative;
}
.accordion-wrapper:before {
content: '';
display: block;
position: absolute;
width: calc(100% + 200px);
height: calc(100% + 300px);
background: var(--color_coral02);
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
z-index: -1;
}
dl.qa{

margin: 0 auto;
width: 80%;
}
/*アコーディオン設定*/
section#qa dt:before, section#qa dd:before{
padding: 6px 0;
left: 2px;
top: 2px;
}
section#qa dt{
background-color: #ffffff;
padding: 10px 50px 10px 50px;
border-radius: 5px;
}
section#qa dt.q:after {
content: '▼';
right: 20px;
position: absolute;
transform: translateY(-50%);
top: 50%;
}
section#qa dt.q.active:after {
content: '▲';
}
section#qa dd {
background: #ffffff;
display: none;
}
/*２行目１文字下げ*/
section#qa p.qa-indent {
padding-left: 1em;
text-indent: -1em;
margin-bottom: 0;
font-size: 0.85em;
}
section#qa p.qa-indent:first-child {
margin-top: 5px;
}
.accordion-wrapper .qa dt,
.accordion-wrapper .qa dd {
padding:10px 10px 10px 50px;
position: relative;
border-radius: 5px;
}
.accordion-wrapper .qa dt {
font-size: 1.1rem;
margin-bottom:15px;
line-height:1.5;
}
.accordion-wrapper .qa dd {
margin-bottom:40px;
font-size: 1.1rem;
}
.accordion-wrapper .qa dt:before,
.accordion-wrapper .qa dd:before {
border-radius: 3px;
font-size:170%;
font-weight:bold;
display: inline-block;
vertical-align: middle;
line-height:1;
padding: 7px 0;
text-align: center;
width: 40px;
position: absolute;
left: 0;
top: 0;
}
.accordion-wrapper .qa dt:before {
background-color:var(--color_blue02);
color:#fff;
content:"Q";
}
.accordion-wrapper .qa dd:before {
background-color:var(--color_pink02);
color:#ffffff;
content:"A";
}
@media screen and (max-width: 480px){
dl.qa {
width: 100%;
}
.accordion-wrapper{
margin: 40px auto;
}
}
/*--感想スライド--*/
section.thoughts {
padding: 100px 10px 80px;
position: relative;
margin: 120px auto 100px;
}
section.thoughts:before {
content: '';
display: block;
position: absolute;
width: 100%;
height: 100%;
background: #ffffff;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
border-radius: 50%;
}
section.thoughts h5 {
width: 80%;
height: 80px;
position: absolute;
left: 50%;
transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
top: 30px;
background: url(/college/jyukensei/images/event/oc2025/oc2025_top_qa_title_voice.webp) no-repeat center / contain;
display: block;
}
.thouchts_slider {
margin: 0 30px;
}
section.thoughts div:nth-child(2) {
padding: 60px 60px 0;
}
div.thouchts_slider ul.slider{
width: 100%;
height: auto;
}
div.thouchts_slider ul.slider li{
position: relative;
text-align: center;
width: 100%;
height: auto;
}
div.thouchts_slider ul.slider li div {
width: calc(100% - 20%);
padding-top: 100%;
background-position: center;
background-repeat: no-repeat;
background-size: contain;
margin: 0 auto;
}
section.thoughts ul li div.thoughts01{
background-image: url(/college/jyukensei/images/event/oc2024/oc2024_thoughts_girl01.svg);
}
section.thoughts ul li div.thoughts02{
background-image: url(/college/jyukensei/images/event/oc2024/oc2024_thoughts_girl02.svg);
}
section.thoughts ul li div.thoughts03{
background-image: url(/college/jyukensei/images/event/oc2024/oc2024_thoughts_girl03.svg);
}
section.thoughts ul li div.thoughts04{
background-image: url(/college/jyukensei/images/event/oc2024/oc2024_thoughts_girl04.svg);
}
section.thoughts ul li div.thoughts05{
background-image: url(/college/jyukensei/images/event/oc2024/oc2024_thoughts_girl05.svg);
}
section.thoughts ul li div.thoughts06{
background-image: url(/college/jyukensei/images/event/oc2024/oc2024_thoughts_girl06.svg);
}
div.thouchts_slider ul.slider li div p {
text-indent: 100%;
white-space: nowrap;
overflow: hidden;
width: 100%;
padding-top: 30%;
position: absolute;
top: 0;
left: 0;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
margin: 0 auto;
}
section.thoughts ul li div.thoughts01 p{
background-image: url(/college/jyukensei/images/event/oc2024/oc2024_thoughts_girl01_f.svg);
}
section.thoughts ul li div.thoughts02 p{
background-image: url(/college/jyukensei/images/event/oc2024/oc2024_thoughts_girl02_f.svg);
}
section.thoughts ul li div.thoughts03 p{
background-image: url(/college/jyukensei/images/event/oc2024/oc2024_thoughts_girl03_f.svg);
}
section.thoughts ul li div.thoughts04 p{
background-image: url(/college/jyukensei/images/event/oc2024/oc2024_thoughts_girl04_f.svg);
}
section.thoughts ul li div.thoughts05 p{
background-image: url(/college/jyukensei/images/event/oc2024/oc2024_thoughts_girl05_f.svg);
}
section.thoughts ul li div.thoughts06 p{
background-image: url(/college/jyukensei/images/event/oc2024/oc2024_thoughts_girl06_f.svg);
}
div.thouchts_slider ul.slider .slick-dots{
margin-top: 10px;
}
@media screen and (max-width: 480px){
section.thoughts {
padding: 40px 0;
margin: 80px auto 40px;
}
section.thoughts:before {
width: calc(100% + 100px);
}
section.thoughts h5 {
width: 100%;
height: 90px;
top: 20px;
}
.thouchts_slider {
margin: 0 auto;
}
section.thoughts div:nth-child(2){
padding: 30px 20px 0;
}
}
/*--当日の様子（ショート動画）--*/
section.short-movie{
width: 100%;
height: auto;
margin: 80px 0 -80px;
position: relative;
}
section.short-movie:before {
content: '';
display: block;
position: absolute;
width: calc(100% + 50%);
height: calc(100% + 300px);
background: linear-gradient(180deg, var(--color_coral02) 0%, var(--color_green01_rgb) 100%) no-repeat center;
z-index: -1;
left: 50%;
transform: translateX(-50%);
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
}
section.short-movie h5{
width: 80%;
height: 80px;
position: absolute;
left: 50%;
transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
top: 30px;
background: url(/college/jyukensei/images/event/oc2025/oc2025_top_qa_title_last-year.webp) no-repeat center / contain;
display: block;
}
.short_erea {
width: 100%;
margin: 50px auto;
padding: 30px 20px 50px;
position: relative;
}
section.short-movie p {
width: 10em;
margin: 0 auto -1em;
font-size: 1.5em;
transform: rotate(-3deg);
display: block;
position: relative;
color: #351902;
font-family: 'M PLUS Rounded 1c', sans-serif;
font-weight: 900;
}
section.short-movie p:before, section.short-movie p:after {
content: '';
display: block;
position: absolute;
width: 2.5em;
height: 2px;
border-bottom: solid 1px;
top: 50%;
}
section.short-movie p:before {
left: -5px;
transform: translateY(-50) rotate(55deg);
-webkit-transform: translateY(-50%) rotate(55deg);
-ms-transform: translateY(-50%) rotate(55deg);
}
section.short-movie p:after {
right: -5px;
transform: translateY(-50) rotate(-55deg);
-webkit-transform: translateY(-50%) rotate(-55deg);
-ms-transform: translateY(-50%) rotate(-55deg);
}
h4.short {
text-indent: 100%;
white-space: nowrap;
overflow: hidden;
display: block;
width: 100%;
height: 100px;
background: url(/college/jyukensei/images/campuslife/students2024_ShortMovie-title.svg) no-repeat center / contain;
}
.short_outer{
position: sticky;
max-width: 600px;
margin: 0 auto;
}
.ytshort_slider {
/*width: 98%;*/
max-width: 800px;
height: auto;
overflow-x: scroll;
position: relative;
margin: 0 auto;
}
/*スクロールバー外装*/
.ytshort_slider::-webkit-scrollbar{ 
width: 100%;
height: 20px;
padding: 2px;
}
/*スクロールバー内装*/
.ytshort_slider::-webkit-scrollbar-track{ 
border-radius: 10px;
background-color: #F1F0D3;
}
/*スクロールバーつまみ部分*/
.ytshort_slider::-webkit-scrollbar-thumb{ 
background-color: #E7E039;
border-radius: 9px;
height: 18px;
}
/*スクロールバーfirefox対応*/
.ytshort_slider { 
scrollbar-width: 100%;
scrollbar-height: 20px;
scrollbar-color: #E7E039;
}
.short_warpper {
width: 100%;
margin: 80px 0 20px;
display: flex;
/*justify-content: space-around; ←動画減ったら復活*/
}
.short_warpper div{
display: flex;
justify-content: center;
align-items: center;
width: 35%;
height: 100%;
margin: 5px;
position: relative;
filter: drop-shadow(3px 3px 3px #B6C0C8);
}
.short_warpper div:before {
content: '';
display: block;
position: absolute;
width: 60px;
height: 60px;
background: url(/college/jyukensei/images/other/icon_shorts.svg) no-repeat center / contain;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
filter: drop-shadow(1px 3px 3px #B6C0C8);
}
.short_warpper div a {
border-radius: 20px;
overflow: hidden;
border: solid 4px #ffffff;
display: block;
}
.short_warpper div a img {
-webkit-transition: all .3s ease-out;
-moz-transition: all .3s ease-out;
-ms-transition: all .3s ease-out;
transition: all .3s ease-out;
}
.short_warpper div a img:hover {
opacity: .8;
-moz-transform: scale(1.1);
-webkit-transform: scale(1.1);
-ms-transform: scale(1.1);
transform: scale(1.1);
}
.short_more{
max-width: 800px;
margin: 20px auto 0;
}
/*ホバーで背景拡大*/
.fadeLeft {
animation-name:fadeLeftAnime;
animation-duration:0.5s;
animation-fill-mode:forwards;
opacity: 0;
}
@keyframes fadeLeftAnime{
from {
opacity: 0;
transform: translateX(-100px);
}
to {
opacity: 1;
transform: translateX(0);
}
}
/*popup画面*/
.mfp-content{
aspect-ratio:9 /16;
}
.mfp-iframe-holder {
padding-top: 100px;
}
.mfp-iframe-holder .mfp-content {
line-height: 0;
width: 100%;
max-width: 350px;
}
.mfp-iframe-scaler iframe {
border-radius: 10px;
overflow: hidden;
}
@media screen and (max-width: 480px){
section.short-movie h5 {
width: 100%;
}
.short_warpper {
margin: 60px 0 20px;
}	
.short_warpper div{
width: 70%;
}
.short_warpper div:before {
width: 50px;
height: 50px;
}
}

/*--/ その他のコンテンツ /--*/
section#other-content {
position: relative;
z-index: 1;
padding-top: 80px;
padding-bottom:0;
}
/*区切り*/
section#other-content.main_inner:before {
background: var(--color_coral02);
z-index: -1;
}
section#other-content h3 {
background: url(/college/jyukensei/images/event/oc2025/oc2025_top_title_05_other-content.webp) no-repeat center / contain;
}
.etc_info {
display: flex;
align-items: center;
width: 100%;
margin: 50px auto 0;
flex-wrap: wrap;
height: auto;
justify-content: space-around;
position: relative;
}
.etc_info:before {
content: '';
display: block;
position: absolute;
width: calc(100% + 100px);
height: calc(100% + 300px);
background: var(--color_coral02);
z-index: -1;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
}
/*footer前あしらい*/
.etc_info:after {
content: '';
display: block;
position: relative;
width: 90%;
height: auto;
aspect-ratio: 4 / 3;
background: url(/college/jyukensei/images/event/oc2026/oc2026_other-content_staff.webp) no-repeat center / contain;
bottom: 0;
left: 50%;
transform: translateX(-50%);
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
}
.etc_info a{
width: 45%;
height: 120px;
margin-bottom: 50px;
text-align: center;
border: solid 5px #ff7da5;
border-radius: 20px;
text-decoration: none;
display: flex;
justify-content: center;
align-items: center;
color: unset;
font-size: 1.2rem;
font-weight: var(--font-weight-bold);
cursor: pointer;
}
.etc_info a p{
display: block;
width: 100%;
height: 100%;
}
.etc_info a.webOC {
background:  url(/college/jyukensei/images/event/oc2023_etc-info_b_webOC.jpg) 52% 13% / 140% no-repeat, #ffffff;
}
.etc_info a.webOC p{
background:url(/college/jyukensei/images/event/oc2025/oc2025_other-content_btn01.webp) no-repeat center / contain;
}
.etc_info a.kengaku {
background: linear-gradient(90deg, rgba(3, 3, 3, 0.2), rgba(3, 3, 3, 0.2)), url(/college/jyukensei/images/event/oc2025/oc2025_other-content_kengaku.jpg) 50% 11% / 100% no-repeat, #ffffff;
}
.etc_info a.kengaku p{
background:url(/college/jyukensei/images/event/oc2025/oc2025_other-content_btn02.webp) no-repeat center / contain;
}
.etc_info a.gallery {
background: url(/college/jyukensei/images/event/oc2023_etc-info_b_gallery.jpg) 50% 98% / 140% no-repeat, #ffffff;
}
.etc_info a.gallery p{
background:url(/college/jyukensei/images/event/oc2025/oc2025_other-content_btn03.webp) no-repeat center / contain;
}
.etc_info a.consultation {
background: linear-gradient(90deg, rgba(3, 3, 3, 0.2), rgba(3, 3, 3, 0.2)),url(/college/jyukensei/images/event/oc2025/oc2025_other-content_soudankai.jpg) 50% 45% / 140% no-repeat, #ffffff;
}
.etc_info a.consultation p{
background:url(/college/jyukensei/images/event/oc2025/oc2025_other-content_btn04.webp) no-repeat center / contain;
}
@media screen and (max-width: 480px){
.etc_info a{
width: 80%;
margin-bottom: 30px;
}
}
/*スライド下ドット*/
div.program_slider ul.slick-dots{
display: flex;
flex-direction: row;
justify-content: center;
align-content: center;
margin-top: 0;
}
.slick-prev, .slick-next{
width: 40px;
height: 40px;
}
@media screen and (max-width: 480px){
.slick-prev, .slick-next {
width: 35px;
height: 35px;
}
}

/*==================================================
スライダーのためのcss
===================================*/
.slider img {
  width:100%; /*スライダー内の画像を横幅100%に*/
  height:auto;
}

/*slickのJSで書かれるタグ内、スライド左右の余白調整*/
.slider .slick-slide {
  margin:0 10px;/*スライド左右の余白調整*/
}


/*--------------------------------------
top スクロール(スマホ・タブレット)設定
--------------------------------------*/
/*下からの距離が変化して丸の全体が上から下に動く*/
@keyframes circlemove{
      0%{bottom:45px;}
     100%{bottom:-5px;}
 }
/*上から下にかけて丸が透過→不透明→透過する*/
@keyframes cirlemovehide{
      0%{opacity:0}
     50%{opacity:1;}
    80%{opacity:0.9;}
	100%{opacity:0;}
 }

/*--------------------------------------
ふわっと下から表示
--------------------------------------*/
@keyframes fadeUpAnime{
  from {
    opacity: 0;
  transform: translateY(100px);
  }

  to {
    opacity: 1;
  transform: translateY(0);
  }
}

/*==================================================
にゅーん
===================================*/

/* 滑らかに変形して出現 */
.smooth{
	animation-name:smoothAnime;
	animation-duration:2s;
	animation-fill-mode:forwards;
  　transform-origin: left;
	opacity:0;
}

@keyframes smoothAnime{
  from {
  transform: translate3d(-50%, 100%, 0) skewY(12deg);
  opacity:0;
  }

  to {
  transform: translate3d(-50%, 0, 0) skewY(0);
  opacity:1;
  }
}

/* スクロールをしたら出現する要素にはじめに透過0を指定　*/
 
.smoothTrigger{
    opacity: 0;
}

/*==================================================
TOP　ロゴがぐるぐる回る
===================================*/
@keyframes rotate01 {
  0%   { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

/*==================================================
NEXT EVENT　ロゴふりふり（animation wobble-hor-bottom）
===================================*/
/**
 * ----------------------------------------
 * animation wobble-hor-bottom
 * ----------------------------------------
 */
@-webkit-keyframes wobble-hor-bottom {
  0%,
  100% {
    -webkit-transform: translateX(-50%) translateX(0%);
            transform: translateX(-50%) translateX(0%);
    -webkit-transform-origin: 50% 50%;
            transform-origin: 50% 50%;
  }
  15% {
    -webkit-transform: translateX(-50%) translateX(-30px) rotate(-6deg);
            transform: translateX(-50%) translateX(-30px) rotate(-6deg);
  }
  30% {
    -webkit-transform: translateX(-50%) translateX(15px) rotate(6deg);
            transform: translateX(-50%) translateX(15px) rotate(6deg);
  }
  45% {
    -webkit-transform: translateX(-50%) translateX(-15px) rotate(-3.6deg);
            transform: translateX(-50%) translateX(-15px) rotate(-3.6deg);
  }
  60% {
    -webkit-transform: translateX(-50%) translateX(9px) rotate(2.4deg);
            transform: translateX(-50%) translateX(9px) rotate(2.4deg);
  }
  75% {
    -webkit-transform: translateX(-50%) translateX(-6px) rotate(-1.2deg);
            transform: translateX(-50%) translateX(-6px) rotate(-1.2deg);
  }
}
@keyframes wobble-hor-bottom {
  0%,
  100% {
    -webkit-transform: translateX(-50%) translateX(0%);
            transform: translateX(-50%) translateX(0%);
    -webkit-transform-origin: 50% 50%;
            transform-origin: 50% 50%;
  }
  15% {
    -webkit-transform: translateX(-50%) translateX(-30px) rotate(-6deg);
            transform: translateX(-50%) translateX(-30px) rotate(-6deg);
  }
  30% {
    -webkit-transform: translateX(-50%) translateX(15px) rotate(6deg);
            transform: translateX(-50%) translateX(15px) rotate(6deg);
  }
  45% {
    -webkit-transform: translateX(-50%) translateX(-15px) rotate(-3.6deg);
            transform: translateX(-50%) translateX(-15px) rotate(-3.6deg);
  }
  60% {
    -webkit-transform: translateX(-50%) translateX(9px) rotate(2.4deg);
            transform: translateX(-50%) translateX(9px) rotate(2.4deg);
  }
  75% {
    -webkit-transform: translateX(-50%) translateX(-6px) rotate(-1.2deg);
            transform: translateX(-50%) translateX(-6px) rotate(-1.2deg);
  }
}

/*==================================================
絞り込み検索機能
===================================*/
@keyframes zoom-in {
  0% {
   transform: scale(.1);
  }
  100% {
    transform: none;
  }
}
.animate {
  animation: .8s zoom-in;
}

/*==================================================
ホバーアクション
===================================*/
.etc_info a:hover
{
	animation: rotate 0.7s ease-in-out both;
}
@keyframes rotate {
  0% {
    transform: rotate(0deg) translate3d(0, 0, 0);
  }
  25% {
    transform: rotate(3deg) translate3d(0, 0, 0);
  }
  50% {
    transform: rotate(-3deg) translate3d(0, 0, 0);
  }
  75% {
    transform: rotate(1deg) translate3d(0, 0, 0);
  }
  100% {
    transform: rotate(0deg) translate3d(0, 0, 0);
  }
}