.PC #float_icon .BACK_top{
	display: block;
	bottom:100px;
}
.MOBILE #float_icon .BACK_top{
	bottom:100px;
}
/******************** 擐㚚� ********************/
/** 銝𦠜䲮�𤐄摰� **/

#OCU .INTRO_NEW{
    width: 100%;
    height: auto;
    overflow: hidden;
    margin-top: 40px;
    }
    .MOBILE #OCU .INTRO_NEW{
        margin-top: 40px;
    }

#OCU .INTRO_NEW_BG{
    width: 100%;
    height: auto;
    overflow: hidden;
    background: url(../images/OCU/INTRO_new/top_bg.jpg);
    margin: 0 auto;
    background-repeat: no-repeat;
    background-position: top center;
    background-color: #8342c1;
    padding-bottom: 40px;
}
    .MOBILE #OCU .INTRO_NEW_BG{
        width: 100%;
        height: auto;
        overflow: hidden;
        background: url(../images/OCU/INTRO_new/top_bg.jpg);
        margin: 0 auto;
        background-repeat: no-repeat;
        background-position: top center;
        background-color: #8342c1;
        background-size: 220% auto;
    }


#OCU .INTRO_NEW_TBOX{/*�𤐄摰𡁜祝摨�+擃睃漲*/
    width: 750px;
    height: auto;
    overflow: hidden;
    position: relative;
    margin: 0 auto;
    
    }
    .PC #OCU .INTRO_NEW_TBOX{
        height:510px;
        margin-bottom: 30px;  
    }
    .MOBILE #OCU .INTRO_NEW_TBOX {
        width: 100%;
        height: 75vw;
        margin-bottom: -20px;  
    }

.PC #OCU .INTRO_NEW_TBOX h1.TIT{
    position: absolute;
    width: 444px;
    height: 373px;
    left: 25px;
    top:20%;
    text-indent: -9999px;
}
    .MOBILE #OCU .INTRO_NEW_TBOX h1.TIT{
        position: absolute;
        width: 55%;
        height: 0;
        padding-bottom: 46.20495495%;
        background-repeat: no-repeat;
        background-size: cover;
        text-indent: -9999px;
        left: 6%;
        top:10%;
    }
.PC #OCU .INTRO_NEW_TBOX .SAM_PH{
    position: absolute;
    width: 277px;
    height: 509px;
    right: 0px;
    top:3%;
}
    .MOBILE #OCU .INTRO_NEW_TBOX .SAM_PH{
        position: absolute;
        width: 38%;
        height: 0;
        padding-bottom: 69.82671480144%;
        background-repeat: no-repeat;
        background-size: cover;
        right:0%;
        top:3%;
    }


/** 銝𦠜䲮�𤐄摰� **/

/** �梁鍂 **/
#OCU-wrapper .IN_TXT-Purple{color: #8342c1;}
#OCU-wrapper .IN_TXT-Purple_s{color: #e5caff;}
#OCU-wrapper .IN_TXT-Green{color: #005604;}
#OCU-wrapper .IN_TXT-Orange{color: #bf3a00;}
#OCU-wrapper .IN_TXT-Black{color: #333;}
#OCU-wrapper .IN_TXT-Brown{color: #b27f4e;}
#OCU-wrapper .IN_TXT-RED{color: #df4e4e;}
#OCU-wrapper .IN_TXT-Yellow{color: #ffd600;}
#OCU-wrapper .IN_TXT-White{color: #fff;}
#OCU-wrapper .IN_TXT-link-Blue{color: #0098d7;}


.PC #OCU .IRO_TEX01{
    font-size:1.8em;
    line-height: 1.6em;
}
    .MOBILE #OCU .IRO_TEX01{
        font-size:1.5em;
        line-height: 1.6em; 
    }
.PC #OCU .IRO_TEX02{
    font-size:1.6em;
    line-height: 1.6em; 
}
    .MOBILE #OCU .IRO_TEX02{
        font-size:1.5em;
        line-height: 1.6em; 
    }
.PC #OCU .IRO_TEX03{
    font-size:1.3em;
    line-height: 1.6em; 
}
    .MOBILE #OCU .IRO_TEX03{
        font-size:1.2em;
        line-height: 1.6em; 
    }
#OCU .IRO_TEX04{
    font-size:1.1em;
    line-height: 1.6em; 
}

.PC #OCU .IRO_TEX05{
    font-size:1em;
    line-height: 1.6em; 
}
    .MOBILE #OCU .IRO_TEX05{
        font-size:1em;
        line-height: 1.6em; 
    }
#OCU .INTRO_NEW_P_box{
    width: 100%;
    background-color: #8342c1;
    padding: 40px 0;    
}
#OCU .INTRO_NEW_Y_box{
	background-color: #fffde9;
    width: 100%;
    padding: 40px 0;  
	}

#OCU .IN_W_BOX{
    height: auto;
    overflow: hidden;
	margin: 0 auto;
	}
    .PC #OCU .IN_W_BOX{
		width: 100%;
		max-width: 640px;
	}
	.MOBILE #OCU .IN_W_BOX{
		width: 95%;
    }
    
#OCU .INTRO_NEW_M1{
    margin-bottom: 20px;
    
}

#OCU .IN_TIT_Y{/** 璅䠷�屸��𠧧 **/
    display: block;
    color: #ffd600;
    text-align: center;
    font-weight: bold;
    margin:0px auto;
    margin-bottom: 0px; /* 10px */
    font-size:2rem;    
}
    .MOBILE #OCU .IN_TIT_Y{/** 璅䠷�屸��𠧧 **/
        font-size:1.8rem;    
    }
    .IN_TIT_Y:before{
        content: "";
        display: inline-block;
        width: 20px;
        height: 2px;
        background-color: #ffd600;
        vertical-align: middle;
        margin-right: 8px;
        margin-bottom: 4px;
    }
    .IN_TIT_Y:after{
        content: "";
        display: inline-block;
        width: 20px;
        height: 2px;
        background-color: #ffd600;
        vertical-align: middle;
        margin-left: 8px;
        margin-bottom: 4px;
    }

#OCU .IN_TIT_B{/** 璅䠷�屸�𤏸𠧧 **/
    display: block;
    color: #000;
    text-align: center;
    font-weight: bold;
    margin: 0px auto;
    margin-bottom: 0px; /* 10px */
    font-size:2rem;
}
    .MOBILE #OCU .IN_TIT_B{/** 璅䠷�屸�𤏸𠧧 **/
        font-size:1.8rem;  
    }
    .IN_TIT_B:before{
        content: "";
        display: inline-block;
        width: 20px;
        height: 2px;
        background-color: #000;
        vertical-align: middle;
        margin-right: 8px;
        margin-bottom: 4px;
    }
    .IN_TIT_B:after{
        content: "";
        display: inline-block;
        width: 20px;
        height: 2px;
        background-color: #000;
        vertical-align: middle;
        margin-left: 8px;
        margin-bottom: 4px;
    }
#OCU .INTOR_BT{
    margin: 0 auto;
}
#OCU .INTOR_BT a{
    display: block;
    padding: 10px 0;
    border-radius:10px;
    text-align: center;
    font-size:1.5em;
    margin: 10px auto;
}
    .PC #OCU .INTOR_BT{
        width: 300px;
    }
    .MOBILE #OCU .INTOR_BT{
        width: 88%;
    }
#OCU .INTOR_BT a.I_BT-PURPLE{
    
	background-color: #a364d4;
	color: #fff;
	}
	#OCU .INTOR_BT a.I_BT-PURPLE:hover{			
		background-color: #c48af0;
		color: #fff;
	}

#OCU .INTOR_BT .I_BT-RED{
    display: block;
	background-color: #df4e4e;
    color: #fff;
    }

		.PC #OCU-wrapper .INTOR_BT .I_BT-RED:hover{
			background-color: #fa4848;
			color: #fff;
		}
/** �梁鍂 **/

/** 蝚砌������頃��憛� **/
#OCU .ALL_BG{   
    width: 100%;
    margin-top: 40px;
}
#OCU .ALL_TIT{
    width: 65%;
    height: 55px;
    border: 3px solid #ffd600;
    background-color: #fffde9;
    border-radius:55px;
    line-height: 50px;
    font-size: 1.9em;
    text-align: center;
    font-weight:bold; 
    margin: 0 auto;
    z-index: 1;
    margin-top: -50px;
    margin-bottom: 15px;
}
    .MOBILE #OCU .ALL_TIT{
        width: 85%;
        height: 50px;
        border: 3px solid #ffd600;
        background-color: #fffde9;
        border-radius:50px;
        line-height: 45px;
        font-size: 1.5em;
        text-align: center;
        font-weight:bold; 
        margin: 0 auto;
        z-index: 1;
        margin-top: -50px;
        margin-bottom: 15px;
    }
#OCU .ALL_TIT_BOX{
    position: relative;
    width: 100%;
    border-radius:20px;
    border: 3px solid #ffd600;
    background-color: #fffde9;
    z-index: 0;
    text-align: center;
    padding: 25px 10px 10px 10px;
}

#OCU .ALL_BG .SALL_BOX{
    width: 100%;
    height: auto;
    overflow: hidden;
}
#OCU .ALL_BG .SALL_BOX ul{
    width: 68%;
    display: flex;
    flex-direction: row;
    justify-content: space-around;
    flex-wrap: wrap;
    align-content:center;
    margin: 5px auto;
}
    .MOBILE #OCU .ALL_BG .SALL_BOX ul{
        width: 100%;
    }
#OCU .ALL_BG .SALL_BOX li{
    height: 50px;
    color: #b27138;
    font-size: 1.6em;
    line-height: 50px;
    text-align: center;
}
    .MOBILE #OCU .ALL_BG .SALL_BOX li{
        height: 40px;
        color: #b27138;
        font-size: 1.3em;
        line-height: 40px;
        text-align: center;
    }

#OCU .ALL_BG .SALL_BOX li:nth-child(1){
    width: 47.5%;
    border: 1px solid #b27138;
}
#OCU .ALL_BG .SALL_BOX li:nth-child(2){
    width: 5%;
}
#OCU .ALL_BG .SALL_BOX li:nth-child(3){
    width: 47.5%;
    border: 1px solid #b27138;
}

/** 敶梁�� **/
#OCU .VIDEO_BOX{
    width: 100%;
    height: auto;
    overflow: hidden;
    margin: 0 auto;
    }
    #OCU .VIDEO_BOX .VIDEO{
        width: 100%;
        height: 0;
        padding-bottom: 56.25%;
        background-size: cover;
        border: 2px solid #dedede;
        position:relative;
        -webkit-box-sizing:border-box;
        border-radius:20px; 
        margin: 12px auto 4px auto;  
    }
    .MOBILE #OCU .VIDEO_BOX .VIDEO{
        border-radius:0px; 
    }
    .PC #OCU .VIDEO_BOX .VIDEO iframe{
        width:100%;
        height:100%;
        border-radius:20px; 
        position:absolute;
        left:0;
        top:0;
    }

    .MOBILE #OCU .VIDEO_BOX .VIDEO iframe{
        width:100%;
        height:100%;
        border-radius:0; 
        position:absolute;
        left:0;
        top:0;
    }

/** 敶梁�� **/
    
/** 蝚砌��典� ***/

/** 蝚砌�屸�典� ***/
#OCU .IMG_BOX{
    width: 100%;
    height: auto;
    margin: 0 auto;
}
#OCU .IMG_BOX img{
    display: block;
    width: 100%;
    height: auto;
    margin: 0 auto;
}
#OCU .PRO_BG{
    width: 100%;
    height: auto;
    overflow: hidden;
}
#OCU .PRO_BG .Purple {
    width: 100%;
    height: auto;
    overflow: hidden;
    border-radius: 15px;
    margin-top: 10px;
    background-color: #f5ebfc;
}

#OCU .PRO_BG .Purple:hover {
    border-top: 1px solid #8342c1;
    border-right: 1px solid #8342c1;
    border-left: 1px solid #8342c1;
    border-bottom: 6px solid #8342c1;
    background-color: #f5ebfc;
}

#OCU .PRO_BG .Green {
    width: 100%;
    height: auto;
    overflow: hidden;
    border-radius: 15px;
    margin-top: 10px;
    background-color: #eaf6ea;
}

#OCU .PRO_BG .Green:hover {
    border-top: 1px solid #005604;
    border-right: 1px solid #005604;
    border-left: 1px solid #005604;
    border-bottom: 6px solid #005604;
    background-color: #eaf6ea;
}

#OCU .PRO_BG .Orange {
    width: 100%;
    height: auto;
    overflow: hidden;
    border-radius: 15px;
    margin-top: 10px;
    background-color: #ffefe8;
}

#OCU .PRO_BG .Orange:hover {
    border-top: 1px solid #bf3a00;
    border-right: 1px solid #bf3a00;
    border-left: 1px solid #bf3a00;
    border-bottom: 6px solid #bf3a00;
    background-color: #ffefe8;
}


#OCU .PRO_BG .PRO_COM{
    width: 100%;
    height: auto;
    overflow: hidden;
    padding: 10px;
}
#OCU .PRO_BG .PRO_COM ul{
    width: 100%;
    height: auto;
    overflow: hidden;
    display: flex;
    flex-direction: row;
    justify-content: space-around;
    flex-wrap: wrap;
    align-content:center;
}
#OCU .PRO_BG .PRO_COM li{
    padding: 5px;
}
#OCU .PRO_BG .PRO_COM li:nth-child(1){
    width: 40%;
    font-size: 1.6em;
}
    .MOBILE #OCU .PRO_BG .PRO_COM li:nth-child(1){
        width: 100%;  
    }
#OCU .PRO_BG .PRO_COM li:nth-child(2){
    width: 60%;
    font-size: 1.3em;
    text-align: right;
}
    .MOBILE #OCU .PRO_BG .PRO_COM li:nth-child(2){
        width: 100%;
        font-size: 1.2em;
        text-align: left;
        margin-top: -10px;
    }
#OCU .PRO_BG .PRO_COM li:nth-child(3){
    width: 100%;
    font-size: 1.2em;
}

#OCU .PRO_BG a {
    display: block;
    width: 100%;
    height: auto;
    overflow: hidden;
    border-radius: 15px;
    color: #fff;
    cursor: pointer;
}

#OCU .PRO_BG .PRO_COM li.COURSE_BTN {
    text-align: right;
    width: 100%;
}

.MOBILE #OCU .PRO_BG .PRO_COM li.COURSE_BTN {
    width: 100%;
    text-align: center;
}
#OCU .PRO_BG .PRO_COM li.COURSE_BTN .BT_PH {
    width: 40%;
    height: 40px;
    line-height: 40px;
    font-size: 1.2em;
    text-align: center;
    color: #fff;
    border-radius: 10px;
    margin: 0 auto;
    display: inline-flex;
    }
    .MOBILE #OCU .PRO_BG .PRO_COM li.COURSE_BTN .BT_PH {
        width: 45%;
        margin: 3px;
    }

#OCU .PRO_BG .PRO_COM li.COURSE_BTN .BT_PH a {
    margin-top: revert;
}

/* 憿讛𠧧 */
#OCU .PRO_BG .PRO_COM li.COURSE_BTN .BT_PH{
    background-color: #df4e4e;
}
#OCU .PRO_BG .PRO_COM li.COURSE_BTN .BT_PH:hover{
    background-color: #fa4848;
}

#OCU .PRO_BG .PRO_COM li.COURSE_BTN .BT_PH:nth-child(2) {
    background-color: #8342c1;
}
#OCU .PRO_BG .PRO_COM li.COURSE_BTN .BT_PH:nth-child(2):hover {
    background-color: #8a53d4;
}

/** 蝚砌�屸�典� ***/

/** 蝚砌�匧����頃��憛� **/
#OCU .ALL_TIT02{
    width: 65%;
    height: 55px;
    border: 3px solid #ffd600;
    background: -webkit-linear-gradient(left, #8342c1 0%,#005604 51%,#bf3a00 100%); /* Chrome10-25,Safari5.1-6 */
    border-radius:55px;
    line-height: 50px;
    font-size: 1.9em;
    text-align: center;
    font-weight:bold; 
    margin: 0 auto;
    z-index: 1;
    margin-top: 20px;
    margin-bottom: 15px;
    color: #fff;
}
    .MOBILE #OCU .ALL_TIT02{
        width: 85%;
        height: 50px;
        border: 3px solid #ffd600;
        background-color: #fffde9;
        border-radius:50px;
        line-height: 45px;
        font-size: 1.5em;
        text-align: center;
        font-weight:bold; 
        margin: 0 auto;
        z-index: 1;
        margin-top: 20px;
        margin-bottom: 15px;
    }
#OCU .ALL_TIT_BOX02{
    position: relative;
    width: 90%;
    border-radius:20px;
    border: 3px solid #ffd600;
    background-color: #8342c1;
    z-index: 0;
    text-align: center;
    padding: 25px 0px 20px 0px;
    margin: 0 auto;
}
    .MOBILE #OCU .ALL_TIT_BOX02{
        position: relative;
        width: 100%;
        border-radius:20px;
        border: 3px solid #ffd600;
        background-color: #8342c1;
        z-index: 0;
        text-align: center;
        padding: 25px 0px 20px 0px;
    }
    .MOBILE #OCU .ALL_TIT_BOX02 p.IRO_TEX02{
        font-size:1.3em;
    }


#OCU .ALL_BG .SALL_BOX02{
    width: 80%;
    height: auto;
    overflow: hidden;
    margin: 0 auto;   
}
    .MOBILE #OCU .ALL_BG .SALL_BOX02{
        width: 95%;
        height: auto;
        overflow: hidden;
        margin: 0 auto;   
    }

#OCU .ALL_BG .SALL_BOX02 ul{
    width: 100%;
    display: flex;
    flex-direction: row;
    align-items: stretch;
    justify-content: space-around;
    flex-wrap: wrap;
    align-content:center;
    margin: 10px auto;
}
#OCU .ALL_BG .SALL_BOX02 li{
    text-align: center;
    padding-bottom: 10px;
    
}

#OCU .ALL_BG .SALL_BOX02 li:nth-child(1){
    width: 47.5%;
    height: auto;
    overflow: hidden;
    background-color: #ede1d0;
    border-radius:15px;
    
}
#OCU .ALL_BG .SALL_BOX02 li:nth-child(1) .S_PRO_TIT{
    width: 100%;
    color: #fff;
    font-size:1.6em; 
    text-align: center;
    background-color: #d5a868;
    border-radius:15px 15px 0 0;
    padding: 3px 0 3px 0; 
}
    .MOBILE #OCU .ALL_BG .SALL_BOX02 li:nth-child(1) .S_PRO_TIT{
        font-size:1.3em; 
    }
#OCU .ALL_BG .SALL_BOX02 li:nth-child(2){
    display: flex;
    justify-content: space-around;
    align-items: center;
    width: 5%;
    color: #fff;
    
}
#OCU .ALL_BG .SALL_BOX02 li:nth-child(3){
    width: 47.5%;
    height: auto;
    overflow: hidden;
    background-color: #ecdffd;
    border-radius:15px;
}
#OCU .ALL_BG .SALL_BOX02 li:nth-child(3) .S_PRO_TIT{
    width: 100%;
    color: #fff;
    font-size:1.6em;
    text-align: center;
    background-color: #b57aff;
    border-radius:15px 15px 0 0;
    padding: 3px 0 3px 0; 
}
    .MOBILE #OCU .ALL_BG .SALL_BOX02 li:nth-child(3) .S_PRO_TIT{
        font-size:1.3em;
    }

/** 蝚砍�𥕦���𡝗���憛� **/
#OCU .INTRO_PH_TEXTBG{
    width: 90%;
    height: auto;
    display: flex;
    flex-direction: row;
    align-items: stretch;
    justify-content: space-around;
    flex-wrap: wrap;
    align-content:center;
    margin: 20px auto;  
}
    .MOBILE #OCU .INTRO_PH_TEXTBG{
        width: 100%;

    }
.PC #OCU .INTRO_PH_TEXT{
    width: 50%;
    height: auto;
    display: flex;
    flex-direction: row;
    align-items: stretch;
    justify-content: space-around;
    flex-wrap: wrap;
    align-content:center;
    padding: 20px 0 20px 0;
}
    .MOBILE #OCU .INTRO_PH_TEXT{
        width: 100%;
        height: auto;
        display: flex;
        flex-direction: row;
        align-items: stretch;
        justify-content: space-around;
        flex-wrap: wrap;
        align-content:center;
        padding: 20px 15px 20px 15px;
        position: relative;
    }

    .PC #OCU .PUZZLE_01{       
        border-radius:25px 0 0 0; 
        background-color: #fdf4cd;
        position: relative;
        z-index: 0;
    }
        .MOBILE #OCU .PUZZLE_01{
            width: 100%;
            border-radius:20px 20px 0 0; 
            background-color: #fdf4cd;
            z-index: 0;
        }
    .PC #OCU .PUZZLE_01::after{
        content:'';
        position: absolute;
        background-color: #f5dbd8;
        width: 60px;
        height: 30px;
        border-radius:60px 60px 0 0 ; 
        right:10%;
        bottom:0px;
        z-index: -1;
    }
        .MOBILE #OCU .PUZZLE_01::after{
            content:'';
            position: absolute;
            background-color: #fdf4cd;
            width: 60px;
            height: 60px;
            border-radius:60px;
            z-index: -1;
        }
    .PC #OCU .PUZZLE_02{
        border-radius:0 25px 0 0; 
        background-color: #d2e5e2;
        position: relative;
        
    }
        .MOBILE #OCU .PUZZLE_02{
            width: 100%;
            border-radius:0; 
            background-color: #d2e5e2;
            z-index: 0;
        }
    .PC #OCU .PUZZLE_02::after{
        content:'';
        position: absolute;
        background-color: #fdf4cd;
        width: 60px;
        height: 60px;
        border-radius:60px; 
        left:-30px;
        bottom:10%;
        
    }
        .MOBILE #OCU .PUZZLE_02::after{
            content:'';
            position: absolute;
            background-color: #fdf4cd;
            width: 60px;
            height: 60px;
            border-radius:60px; 
            top:-30px;
            right:30px;
            z-index: -1;
        }
    .PC #OCU .PUZZLE_03{
        border-radius:0px 0 0 25px; 
        background-color: #f4dcd7;
        position: relative;
        z-index: 0;
    }
        .MOBILE #OCU .PUZZLE_03{
            width: 100%;
            border-radius:0px; 
            background-color: #f4dcd7;
            
        }
    .PC #OCU .PUZZLE_03::after{
        content:'';
        position: absolute;
        background-color: #e4edc9;
        width: 60px;
        height: 60px;
        border-radius:60px; 
        right:-30px;
        top:10%;
        z-index: -1;
    }
        .MOBILE #OCU .PUZZLE_03::after{
            content:'';
            position: absolute;
            background-color: #d2e5e2;
            width: 60px;
            height: 60px;
            border-radius:60px; 
            top:-30px;
            right:30px;
            z-index: -1;
        }
    #OCU .PUZZLE_04{
        border-radius:0px 0 25px 0; 
        background-color: #e4edc9;
        position: relative;
        z-index: 0;
    }
        .MOBILE #OCU .PUZZLE_04{
            width: 100%;
            border-radius:0px 0 20px 20px; 
            background-color: #e4edc9;
            z-index: 0;
        }
    .PC #OCU .PUZZLE_04::after{
        content:'';
        position: absolute;
        background-color: #d2e4e2;
        width: 60px;
        height: 60px;
        border-radius:60px; 
        left:10%;
        top:-30px;
        z-index: -1;
    }
        .MOBILE #OCU .PUZZLE_04::after{
            content:'';
            position: absolute;
            background-color: #f4dcd7;
            width: 60px;
            height: 60px;
            border-radius:60px; 
            top:-30px;
            right:30px;
            z-index: -1;
        }

.PC #OCU .INTRO_PH_TEXT .I_PH{
    width: 120px;
    height: 120px;
    margin: 0 auto;
    margin-bottom: 5px;
       
}
    .MOBILE #OCU .INTRO_PH_TEXT .I_PH{
        width: 100px;
        height: 100px;
        margin: 0 auto;     
    }
    #OCU .Yellow_BG{
        background-color: #fffde9;    
    }
    #OCU .Purple_BG{
        background-color: #8342c1; 
    }
#OCU .INTRO_PH_TEXT .I_PH img{
    display: block;
    width: 100%;
    height: auto;
    margin: 0 auto;
}
#OCU .INTRO_PH_TEXT .I_TEXT{
    width: 100%;
    height: auto;
    overflow: hidden;
    text-align: center;
    z-index: 1;
}
    .MOBILE #OCU .INTRO_PH_TEXT .I_TEXT{
        width: calc(100% - 100px);
        height: auto;
        overflow: hidden;
        text-align: left;
        padding-left: 12px;
    }


/** 蝚砌�𥪜���𡝗���憛� **/
#OCU .INTRO_PH_TEXTBG02{
    width: 90%;
    height: auto;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: space-around;
    flex-wrap: wrap;
    align-content:center;
    margin: 0 auto;
    
}
    .MOBILE #OCU .INTRO_PH_TEXTBG02{
        width: 100%;
    }
#OCU .INTRO_PH_TEXT02{
    width: 100%;
    height: auto;
    display: flex;
    flex-direction: row;
    align-items: stretch;
    justify-content: space-around;
    flex-wrap: wrap;
    align-content:center;
    margin: 10px auto;
    border-radius:999px;
    border: 3px solid #d4a766;
    padding: 1%;
    background-color: #fff8ee;
}

#OCU .INTRO_PH_TEXT02 .I_PH{
    width: 120px;
    height: 120px;
    border-radius:120px;
    margin: 0 auto;
       
}
#OCU .INTRO_PH_TEXT02 .I_PH img{
    display: block;
    width: 100%;
    height: auto;
    border-radius:120px;
    margin: 0 auto;
}
#OCU .INTRO_PH_TEXT02 .I_TEXT{
    width: calc(100% - 120px);  
    height: auto;
    overflow: hidden;
    text-align: left;
    padding: 0px 15px 0 10px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
}

/** FEEDBACK **/
#OCU .INTRO_FEEDBACK_BOX{
    width: 100%;
    height: auto;
    overflow: hidden;
    margin: 0 auto;
    margin-top: 20px;
    }

    #OCU .INTRO_FEEDBACK{
        width: 100%;
        height: auto;
        display: flex;
        flex-direction: row;
        align-items: stretch;
        justify-content: space-around;
        flex-wrap: wrap;
        align-content:center; 
        }

		.PC #OCU .INTRO_FEEDBACK .INTRO_FEEDBACK-L{/*撌血��*/
		    width: 95px;
		    height: 95px;
		    float: left;
		    border-radius: 56%;
		    box-sizing: border-box;
		    border: 1px solid #b27f4e;   
		}
			#OCU .INTRO_FEEDBACK .INTRO_FEEDBACK-L img{
				width: 100%;
			    height: auto;
			}
		.MOBILE #OCU .INTRO_FEEDBACK .INTRO_FEEDBACK-L{
		    display: none;   
		}
		.PC #OCU .INTRO_FEEDBACK .INTRO_FEEDBACK-R{/*�𢰧摮�*/
			width: 80%;
		    float: right;
		}
		.MOBILE #OCU .INTRO_FEEDBACK .INTRO_FEEDBACK-R{
			width: 100%;
		    float: right;
        }	
        .MOBILE #OCU .INTRO_FEEDBACK .INTRO_FEEDBACK-R p:nth-child(1){
            margin-bottom: 5px;
		}	

  

/** FEEDBACK **/


/** 蝚砍�剖���𡝗���憛� **/
/** TEACHER **/

#OCU .INTRO_SAM_BG{
    width: 100%;
    height: auto;
    overflow: hidden;
}
#OCU .INTRO_SAM_BG .INTRO_SAM_BOX{
    width: 100%;
    height: auto;
    display: flex;
    flex-direction: row-reverse;
    align-items: stretch;
    justify-content: space-around;
    flex-wrap: wrap;
    align-content:center; 
}
    .MOBILE #OCU .INTRO_SAM_BG .INTRO_SAM_BOX{
        width: 100%;
        height: auto;
        display: flex;
        flex-direction: row;
        align-items: stretch;
        justify-content: space-around;
        flex-wrap: wrap;
        align-content:center; 
    }
#OCU .INTRO_SAM_BG .INTRO_SAM_T{
    width: 55%;
    height: auto;
}
    .MOBILE #OCU .INTRO_SAM_BG .INTRO_SAM_T{
        width:100%;
        height: auto;
        overflow: hidden;
    }
#OCU .INTRO_SAM_BG .INTRO_SAN_IMG{
    width: 45%;
    height: auto;
}
    .MOBILE #OCU .INTRO_SAM_BG .INTRO_SAN_IMG{
        width: 60%;
        height: auto;
        margin: 0 auto;
    }
#OCU .INTRO_SAM_BG .INTRO_SAN_IMG img{
    display: block;
    width: 100%;
    height: auto;
    margin: 0 auto;
}
#OCU .INTRO_SAM_BG .NAME_SAM{
    border-bottom:1px solid #e5caff;
}
#OCU .INTRO_SAM_BG .INTRO_SAM_T .NAME_SAM_T{
    width: 100%;
    height: auto;
    overflow: hidden;
    margin: 5px auto;
}
#OCU .INTRO_SAM_BG .INTRO_SAM_T .NAME_SAM_T ul{
    width: 100%;
    height: auto;
    overflow: hidden;
}
#OCU .INTRO_SAM_BG .INTRO_SAM_T .NAME_SAM_T li{
    display: flex;
    flex-direction: row;
    align-items: stretch;
    justify-content: flex-start;
    flex-wrap: wrap;
    align-content:center;
    margin-bottom: 10px;
}
#OCU .INTRO_SAM_BG .NAME_SAM_T .SAM_T_ICON{
    width: 8px;
    height: 8px;
    border-radius:999px;
    background-color: #e5caff;
    margin-top: 10px;
}
#OCU .INTRO_SAM_BG .NAME_SAM_T p{
    width: calc(100% - 8px);
    padding-left: 10px;

}



/** TEACHER **/

/** 蝷曄黎 **/
#OCU .INTRO_SOCIAL_BOX{
    display: block;
    width: 100%;
    height: auto;
    overflow: hidden;
    margin: 0 auto;
    text-align: left;
    margin-top: 28px;
    }
    .MOBILE #OCU .INTRO_SOCIAL_BOX{
        width : 100%;
        margin-top: 20px;
    }

#OCU .INTRO_SOCIAL_BT01{
	width:510px;
	height: 50px;
	margin-top: 5px;
	margin-bottom: 30px;
}
    .MOBILE #OCU .INTRO_SOCIAL_BT01{
        width:100%;
        height: auto;
        overflow: hidden;
        margin-top: 5px;
        margin-bottom: 30px;
    }

.PC #OCU .INTRO_SOCIAL_BT01 ul{
	width:510px;
    height: 50px;
    display: flex;
	flex-direction: row;
	justify-content: space-between;
	flex-wrap: wrap;
	align-content:center;
}
    .MOBILE #OCU .INTRO_SOCIAL_BT01 ul{
        width:100%;
        height: auto;
        overflow: hidden;

    }
.PC #OCU .INTRO_SOCIAL_BT01 li{
	width:250px;
    height: 50px;
}

    .MOBILE #OCU .INTRO_SOCIAL_BT01 li{
        width:100%;
        height: 50px;
    }
    .MOBILE #OCU .INTRO_SOCIAL_BT01 li:nth-child(1){
        margin-bottom: 10px;
    }

#OCU .INTRO_SOCIAL_BT01 a{
	display: block;
	width: 100%;
	height: 50px;	
	background-color: #b57aff;
	border:1px solid #dec4ff;
	color: #fff;
	text-align: center;
	font-size: 1.2em;
	line-height: 48px;
	border-radius:10px;
	box-sizing: border-box;
}
    #OCU .INTRO_SOCIAL_BT01 a:hover{
		background-color: #C029FF;
    }
    

#OCU .INTRO_SOCIAL_BT02{
	width:250px;
    height: 50px;
    margin-top: 5px;
}
	.MOBILE #OCU .INTRO_SOCIAL_BT02{
		width:100%;
		height: 50px;
	}
#OCU .INTRO_SOCIAL_BT02 ul{
	width:100%;
	height: 50px;
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	flex-wrap: wrap;
	align-content:center;
}
#OCU .INTRO_SOCIAL_BT02 li{
	width:25%;
	height: 50px;
}
	.MOBILE #OCU .INTRO_SOCIAL_BT02 li{
		width:24%;
		height: 50px;
	}

#OCU .INTRO_SOCIAL_BT02 a{
	display: block;
	width: 50px;
	height: 50px;	
	background-color: #b57aff;
	border:1px solid #dec4ff;
	border-radius:50px;
	background-size: 25px auto;
	background-position: center center;
	background-repeat: no-repeat;
	box-sizing: border-box;
}
	.MOBILE #OCU .INTRO_SOCIAL_BT02 a{
		display: block;
		width: 100%;
		height: 50px;	
		border-radius:10px;
		background-color: #b57aff;    
		border:1px solid #dec4ff;
		background-size: 28px auto;
		background-position: center center;
		background-repeat: no-repeat;
		box-sizing: border-box;
	}
#OCU .INTRO_SOCIAL_BT02 a.INTO_FB{
	background-image: url(../images/OCU/icon/icon_fb.png);
}
	#OCU .INTRO_SOCIAL_BT02 a.INTO_FB:hover{
		background-color: #1877f2;
	}
#OCU .INTRO_SOCIAL_BT02 a.INTO_LINE{
	background-image: url(../images/OCU/icon/icon_line.png);
}
	#OCU .INTRO_SOCIAL_BT02 a.INTO_LINE:hover{
		background-color: #00B900;
	}
#OCU .INTRO_SOCIAL_BT02 a.INTO_IG{
	background-image: url(../images/OCU/icon/icon_ig.png);
}
	#OCU .INTRO_SOCIAL_BT02 a.INTO_IG:hover{
		background-color: #c63f77;
	}
#OCU .INTRO_SOCIAL_BT02 a.INTO_YT{
	background-image: url(../images/OCU/icon/icon_yt.png);
}
	#OCU .INTRO_SOCIAL_BT02 a.INTO_YT:hover{
		background-color: #eb3223;
    }

/** 蝷曄黎 **/

#OCU-wrapper .INTRONEW_BT_F{/*蝵桀�� �梁鍂*/
    clear: both;
    margin: 0 auto;
    width: 100%;
    background-color: rgba(0,0,0,.8);
    position: fixed;
    bottom: 0;
    z-index: 999;
    height: auto;
	}

    #OCU-wrapper .INTRONEW_BT{
        width: 380px;
        height: 100%;
        margin: 8px auto;
	}
	.MOBILE #OCU-wrapper .INTRONEW_BT{
        width: 94%;
	}

	#OCU-wrapper .INTRONEW_BT a{
        display: block;
        width: 100%;
        height: auto;
        border-radius: 10px;
        text-align: center;
        padding: 4px;
        margin: 0 auto;
	}

	#OCU-wrapper .INTRONEW_TEXT_BT{
		font-size: 1.5rem;
		color: #fff;
		text-align: center;
    }
    
	#OCU-wrapper .INTRONEW_TEXT_BTS{
		font-size: 1.2rem;
		color: #fff;
		text-align: center;
        line-height: 1.5;
	}

	#OCU-wrapper .INTRONEW_BT-RED{
	background-color: #df4e4e;
    color: #fff;
        }
        .PC #OCU-wrapper .INTRONEW_BT-RED:hover{
            background-color: #fa4848;
            color: #fff;
        }


/******************** ��厰�� ********************/
/******************** 擐㚚� ********************/

/* �鰵憓�-202206 */
/* ��鞾�鍦�憛� */
#OCU .IN_W_NOTICE_BOX{
    width: 100%;
    max-width: 640px;
    height: auto;
    overflow: hidden;
    margin: -48px auto 20px auto;
    position: relative;
}

#OCU .IN_NOTICE {
    display: block;
    position: relative;
    width: 90%;
    height: auto;
    border: 3px solid #fff6c4;
    background-color: #fff151;
    margin: 0 auto;
    border-radius: 8px;
    padding: 8px 0;
}

.MOBILE #OCU .IN_NOTICE{
    width: 94%;
}

#OCU .IN_NOTICE p{
    text-align: center;
    line-height: 1.3;
}

#OCU .IN_NOTICE p:nth-of-type(1){
    font-weight: bold;
    font-size: 2.25em;
    color: #df4e4e;
}
.MOBILE #OCU .IN_NOTICE p:nth-of-type(1){ /*20220802靽格㺿*/
    font-size: 26px;
}

/*蝞剝�-�鉄��閧𧞄*/
#OCU .arrows-container {
    display: flex;
    position: relative;
    justify-content: center;
    align-items: center;
}

#OCU .arrow-left {
    padding: 12px;
    box-shadow: 4px -4px #9c2103 inset;
    transform: rotate(316deg);
    opacity: 0;
    position: absolute;
    left: 6%;
}
.MOBILE #OCU .arrow-left{
    padding: 6px;
    left: 3%;
}

#OCU .arrow-right {
    padding: 12px;
    box-shadow: 4px -4px #9c2103 inset;
    transform: rotate(316deg);
    opacity: 0;
    position: absolute;
    right: 6%;
}

.MOBILE #OCU .arrow-right {
    padding: 6px;
    right: 3%;
}


@media screen and (orientation:landscape) {
    .MOBILE #OCU .IN_NOTICE p:nth-of-type(1){
        font-size: 2.25em;
    }
    .MOBILE #OCU .arrow-left {
        padding: 12px;
        left: 8%;
    }
    .MOBILE #OCU .arrow-right {
        padding: 12px;
        right: 8%;
    }
}
#OCU .arrow-one {
    animation:arrowMovement 2.5s ease-in-out infinite;
}
#OCU .arrow-two {
    animation:arrowMovement 2.5s 1.5s ease-in-out infinite;
}

@keyframes arrowMovement {
    0% {
        bottom:24px;
        opacity: 0;
    }

    50% {
        opacity: 1;
    }

    100% {
        bottom: 8px;
        opacity: 0;
    }
}

/*蝞剝�-�鉄��閧𧞄*/

/* ��鞾�鍦�憛� 撠�*/

/* �鰵��憛�-�梁鍂 */
#OCU .PH_IMG {
    margin: 0 auto;
    display: block;
    width: 90%;
    text-align: center;
    position: relative;
}

.MOBILE #OCU .PH_IMG{
    width: 98%;
}

#OCU .IRO_TEX02 + .PH_IMG{
    margin-top: 12px;
}

#OCU .PH_IMG + .PH_IMG{
    margin-top: 20px;
}

#OCU .IN_TIT_B + .PH_IMG,
#OCU .IN_TIT_Y + .PH_IMG{
    margin-top: 20px;
    margin-bottom: 35px;
}

/* 暺鮋�� */

#OCU ul.LIST_ROUND_BOX {
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-content: center;
    width: 100%;
    flex-wrap: wrap;
    margin-top: 12px;
}

.MOBILE #OCU ul.LIST_ROUND_BOX {
    align-content: flex-start;
}

#OCU ul.LIST_ROUND_BOX li::before {
    content: "";
    display: block;
    width: 8px;
    height: 8px;
    border-radius: 999px;
    background-color: #b27f4e;
    margin-top: 10px;
    margin-right: 10px;
    flex-shrink: 0;
}

#OCU ul.LIST_ROUND_BOX li {
    display: inline-flex;
    margin-bottom: 8px;
}

#OCU ul.LIST_ROUND_BOX li:last-child {
    margin-bottom: 0;
}

/* 暺鮋�� 撠�*/

#OCU a.PH_IMG:hover {
    filter: brightness(1.1);
}

#OCU .Promo_TXT{
    display: block;
    margin-top: 12px;
}

#OCU .Promo_TXT p{
    text-align: center;
    font-weight: bold;
    font-size: 1.8em;
    line-height: 1.6;
}

#OCU .Promo_TXT p.IN_TXT-Purple_s{
    font-size: 1.3em;
    text-decoration: line-through;
    font-weight: normal;
    line-height: 1.3;
}

#OCU .BLANK-20{
    height: 20px;
}
.PC #OCU .BR{
    margin-left: 8px;
}
.MOBILE #OCU .BR{
    display: block;
    line-height: 1;
    margin-bottom: 8px;
}

.PC #OCU .IN_TIT_01{
    font-size: 2rem;
    text-align: center;
    font-weight: bold;
}

.MOBILE #OCU .IN_TIT_01 {
    font-size: 1.8rem;
    text-align: center;
    font-weight: bold;
}

#OCU .ph_Cross{
    font-weight: normal;
    margin: 0 4px;
}

#OCU .EVENT_TIME{
    display: flex;
    position: relative;
    font-size: 2.5rem;
    text-align: center;
    margin: 8px auto 16px auto;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    flex-wrap: wrap;
    width: 100%;
    flex-direction: row;
}

.MOBILE #OCU .EVENT_TIME{
    font-size: 32px;
}

#OCU .ph_Triangle{
    display: block;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 12px 0 12px 18px;
    border-color: transparent transparent transparent #df4e4e;
    margin: 0 8px 0px 12px;
}

.MOBILE #OCU .ph_Triangle{
    border-width: 8px 0 8px 12px;
    margin: 0 6px 0px 8px;
}

#OCU .EVENT_INTRO{
    display: block;
    text-align: center;
    margin-top: 12px;
    position: relative;
}

#OCU .EVENT_INTRO p:nth-of-type(1){
    font-size: 2.8rem;
    font-weight: 600;
}

.MOBILE #OCU .EVENT_INTRO p:nth-of-type(1) {
    font-size: 32px;
}

#OCU .EVENT_INTRO p:nth-of-type(2) {
    font-size: 2rem;
}

.MOBILE #OCU .EVENT_INTRO p:nth-of-type(2) {
    font-size: 24px;
}

#OCU .EVENT_INTRO p:nth-of-type(1):before,
#OCU .EVENT_INTRO p:nth-of-type(1):after{
    content: "";
    display: inline-block;
    width: 2px;
    height: 58px;
    background-color: #7a49ba;
    position: relative;
    margin-bottom: -16px;
}

#OCU .EVENT_INTRO p:nth-of-type(1):before{
    transform: rotate(324deg);
    margin-right: 20px;
}

#OCU .EVENT_INTRO p:nth-of-type(1):after {
    transform: rotate(36deg);
    margin-left: 20px;
}
.MOBILE #OCU .EVENT_INTRO p:nth-of-type(1):before,
.MOBILE #OCU .EVENT_INTRO p:nth-of-type(1):after{
    height: 48px;
}


@media screen and (max-width: 333px) {
    .MOBILE #OCU .EVENT_INTRO p:before,
    .MOBILE #OCU .EVENT_INTRO p:after{
        display: none;
    }
}
/* �鰵��憛� 撠�*/