@charset "utf-8";
@font-face {
	font-family: 'yg-jalnan';
	src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_four@1.2/JalnanOTF00.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}
@font-face {
    font-family: 'ONE-Mobile-Title';
    src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_2105_2@1.0/ONE-Mobile-Title.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
/* 스크롤시 나타남 */
.scroll_ani.SH {opacity:0; transform:translateY(50px);transition-property:all;transition-duration:1s;}
.scroll_ani.SH[data-on=on] {opacity:1; transform:translateY(0);}
.scroll_ani.LL {opacity:0; transform:translateX(-100px); transition-property:all;transition-duration:1s;}
.scroll_ani.LL[data-on=on]  {opacity:1; transform:translateX(0);}
.scroll_ani.RR {opacity:0; transform:translateX(100px);  transition-property:all;transition-duration:1s;}
.scroll_ani.RR[data-on=on] {opacity:1; transform:translateX(0); }
.scroll_ani.delay15 {transition-delay:0.5s;}

#maintop {position:relative; }
#maintop > .inner {height:755px; display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap;}
#maintop > .inner:after {display:none;}
#maintop > .inner > * {position:relative; z-index:2;}
#maintop > .inner:before {content:''; display:block; width:2560px; height:100%; background:url(/amlib/portal/img/main/topbg.jpg) no-repeat 0 0; border-radius:0 0 0 20rem; position:absolute; bottom:0; left:-10rem; z-index:1;}

#maintop .maintop-deco { position:absolute; top:5rem; left:-12rem; color:#ccc; transform: rotate(90deg); transform-origin: left top; text-transform: uppercase; font-weight:400; opacity:0.5; letter-spacing:0.2rem; font-size:1.8rem; display:flex; align-items:center;}
#maintop .maintop-deco:after {content:''; display:block; width:3.4rem; height:2.7rem; background:url(/amlib/portal/img/main/maintop-decobg.png) no-repeat 50% 50% / contain; transform: rotate(-90deg); margin-left:10rem;}
#maintop .maintop-deco:before {content:''; display:block; width:8rem; height:1px; background:#dedede; position:absolute; top:50%; right:4rem;}


.mt-left { width:calc(50% - 8rem);}
.mt-left .copy p{line-height:1em;}
.mt-left .copy .t1{font-size:4rem; font-weight:300;}
.mt-left .copy .t2{font-size:5rem; font-weight:900; margin-top:2rem;}
.mt-left .copy .t3{font-size:6rem; font-family: 'yg-jalnan'; color:#0c817a; margin-top:2rem;}
.mt-left .mt-search {position:relative; margin-top:7rem;}
.mt-left .mt-search > div {padding:0.4rem; border-radius:5rem; width:calc(100% - 6rem); height:8.5rem;
background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #171877), color-stop(1, #019549));
	background: -moz-linear-gradient(to top, #171877 0%, #019549 100%);
	background: -webkit-linear-gradient(to top,  #171877 0%, #019549 100%);
	background: -o-linear-gradient(to top,  #171877 0%, #019549 100%);
	background: -ms-linear-gradient(to top,  #171877 0%, #019549 100%);
	background: linear-gradient(to top,  #171877 0%, #019549 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#171877', endColorstr='#019549', gradientType=0);
}
.mt-left .mt-search > div > input[type="text"] {background:#fff; border:0; border-radius:5rem; width:100%; height:100%; padding: 0 3rem 0 10rem}
.mt-left .mt-search > div:before {content:''; display:block; width:12.2rem; height:12.2rem; background:url(/amlib/portal/img/main/mt-searchimg.png) no-repeat 50% bottom / contain; position:absolute; bottom:0; left:-4rem;} 
.mt-left .mt-search > input[type="submit"] {width:8.5rem; height:8.5rem; position:absolute; top:0; right:0; border:0; border-radius:50%; background:url(/amlib/portal/img/main/mt-searchbtn.jpg) no-repeat 50% 50%; overflow:hidden; text-indent:-9999px; box-shadow: 0.3rem 0.3rem 0.5rem rgba(0,0,0,0.2);}
.mt-left > ul {display:flex; justify-content: space-between; margin-top:5rem; width:85%;}
.mt-left > ul li a { background:#fff; display:block; border-radius:2rem; display:flex; align-items:center; justify-content: center; flex-direction: column; width:10rem; height:10rem; color:#0c817a; font-weight:700; font-size:1.4rem; transition:all 0.4s;}
.mt-left > ul li a:before {content:''; display:block; width:5rem; height:5rem; background-image:url(/amlib/portal/img/main/mt-link.png); background-repeat:no-repeat; margin:0 auto; background-size:auto 200%;  transition:all 0.4s;}

.mt-left > ul li a.s1:before {background-position: 0 0;} 
.mt-left > ul li a.s2:before {background-position: -5rem 0;} 
.mt-left > ul li a.s3:before {background-position: -10rem 0;} 
.mt-left > ul li a.s4:before {background-position: -15rem 0;} 

.mt-left > ul li a:hover {background:#0c817a; color:#fff; transform:scale(1.1);}
.mt-left > ul li a.s1:hover:before {background-position: 0 -5rem;} 
.mt-left > ul li a.s2:hover:before {background-position: -5rem -5rem;} 
.mt-left > ul li a.s3:hover:before {background-position: -10rem -5rem;} 
.mt-left > ul li a.s4:hover:before {background-position: -15rem -5rem;} 

.mt-right { width:50%; position:relative; padding:0 6rem 3rem 6rem;}
.mt-right > * {position:relative; z-index:1;}
.mt-right:before {content:''; display:block; width:calc(50% + 20px); height:calc(100% - 7rem); position:absolute; bottom:0; left:0; z-index:0; border-radius: 2rem 5rem 5rem 2rem;
background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #3aa7b8), color-stop(1, #0165d8));
	background: -moz-linear-gradient(to top, #3aa7b8 0%, #0165d8 100%);
	background: -webkit-linear-gradient(to top,  #3aa7b8 0%, #0165d8 100%);
	background: -o-linear-gradient(to top,  #3aa7b8 0%, #0165d8 100%);
	background: -ms-linear-gradient(to top,  #3aa7b8 0%, #0165d8 100%);
	background: linear-gradient(to top,  #3aa7b8 0%, #0165d8 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#3aa7b8', endColorstr='#0165d8', gradientType=0);}
.mt-right:after {content:''; display:block; width:calc(50% + 20px); height:calc(100% - 7rem); position:absolute; bottom:0; right:0; z-index:0; border-radius:5rem 2rem 2rem 5rem;
background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #3aa7b8), color-stop(1, #0165d8));
	background: -moz-linear-gradient(to top, #3aa7b8 0%, #0165d8 100%);
	background: -webkit-linear-gradient(to top,  #3aa7b8 0%, #0165d8 100%);
	background: -o-linear-gradient(to top,  #3aa7b8 0%, #0165d8 100%);
	background: -ms-linear-gradient(to top,  #3aa7b8 0%, #0165d8 100%);
	background: linear-gradient(to top,  #3aa7b8 0%, #0165d8 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#3aa7b8', endColorstr='#0165d8', gradientType=0);}
.mt-right .cal-deco {position:absolute; top:10rem; left:4.3rem; color:#fff; transform: rotate(90deg); transform-origin: left top; text-transform: uppercase; font-weight:400; opacity:0.5; letter-spacing:0.2rem;}
.mt-right .cal-wrap {padding:3rem 5rem;}
.mt-right .cal-wrap > * {position:relative; z-index: 1; }
.mt-right .cal-wrap:before {content:''; display:block; width:calc(50% + 20px); height:100%; background:#fff; position:absolute; top:0; left:0; z-index:0; border-radius: 2rem 5rem 0 2rem;}
.mt-right .cal-wrap:after {content:''; display:block; width:calc(50% + 20px); height:100%; background:#fff; position:absolute; top:0; right:0; z-index:0; border-radius:5rem 2rem 2rem 0;}
.mt-right .cal-wrap a.calmore {position:absolute; top:-2rem; left:-2rem; }


.cal {width:100%; position:relative; z-index:1;}
.cal .tit {display:flex; align-items: center; justify-content: space-between; margin-bottom:1rem;}
.cal .tit h3 {font-family: 'ONE-Mobile-Title'; font-size:2.4rem; margin-left:1rem;}
.cal .tit h3 em {color:#e71e76;}
.cal .tit h3 i {color:#e71e76; font-size:1.4em; transform: translateY(0.2rem); display:inline-block;}
.cal .tit .bbtn {background:#fafafa; border-radius:3rem; padding:1rem 1.5rem;}
.cal .tit .bbtn a span {display:inline-block; width:0; text-indent:-9999px;}
.cal .tit .bbtn a i {font-size:2rem; margin:0 0.2rem; opacity:0.5;}
.cal .tit .bbtn a:hover i {opacity:1;}
.cal .tit .bbtn strong {font-size:1.6rem; font-weight:600; color:#333;}
.cal .tit .bbtn strong em {font-size:2rem; font-weight:700;  color:#333;}


.cal table{width:100%; position:relative; z-index:1; text-align:center; }
.cal table:before {content:''; display:block; width:100%; height:3px; background:url(/amlib/portal/img/main/caltablebg.gif) repeat-x; position:absolute; top:0; left:0;}
.cal table:after {content:''; display:block; width:100%; height:3px; background:url(/amlib/portal/img/main/caltablebg.gif) repeat-x; position:absolute; bottom:0; left:0;}
.cal table th {font-size:1.8rem; padding:2rem 0 1rem; font-weight:600;}
.cal table td { padding:0.7rem 0;}
.cal table td p,
.cal table td a,
.cal table td span { display:flex; width:3.6rem; height:3.6rem; font-size:1.4rem;align-items:center; justify-content:center; margin:0 auto; border-radius:50%; line-height:0.2rem;}
.cal table td .close-day {background:#f2f2f2;} 
.cal table td .event-day {background:#e71e76; color:#fff; cursor:pointer;} 
.cal table tr:last-child td {padding-bottom:2rem;}
.cal .cal-info {margin-top:1rem;}
.cal .cal-info span {margin-right:2rem; font-size:1.5rem;}
.cal .cal-info span:before {content:''; display:inline-block; width:1rem; height:1rem; border-radius:50%; background:#f2f2f2; margin-right:0.5rem; transform:translateY(-0.1rem);}
.cal .cal-info span.close:before {background:#f2f2f2;}
.cal .cal-info span.event:before {background:#e71e76;}

.calslide-wrap {margin-top:1rem; display:flex; justify-content:space-between; align-items: center; flex-wrap: wrap;}
.calslide-wrap .calslide {width:calc(100% - 13rem); color:#fff; font-size:1.6rem;}
.calslide-wrap .calslide .items {display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; width:100%; }
.calslide-wrap .calslide .items span {font-weight:800; width:8rem;}
.calslide-wrap .calslide .items span:before {content:''; display:inline-block; width:0.6rem; height:0.6rem; border-radius:50%; background:#fcff00; margin-right:0.5rem; transform:translateY(-0.3rem);}
.calslide-wrap .calslide .items strong { width:calc(100% - 8rem); white-space:nowrap; overflow: hidden; text-overflow: ellipsis;}
.calslide-wrap .controll {width:12rem; display:flex; align-items:center; justify-content:flex-end	;}
.calslide-wrap .controll button {width:3.6rem; height:3.6rem; border-radius:50%;  display:flex; align-items:center; justify-content:center;  position:relative;}
.calslide-wrap .controll button i {font-size:2.4rem; color:#0c817a; transition:all 0.3s;}
.calslide-wrap .controll button span {text-indent: -9999px; display:inline-block; width:0; height:0; overflow:hidden;}
.calslide-wrap .controll button.start-slide,
.calslide-wrap .controll button.stop-slide {background:#fff;}
.calslide-wrap .controll button.prev-slide i,
.calslide-wrap .controll button.next-slide i {color:#fff;}
.calslide-wrap .controll button.start-slide i {font-size:2rem; transform: translateX(0.2rem);}

@media (max-width:1280px){
	.mt-left .copy .t1{font-size:3rem;}
	.mt-left .copy .t2{font-size:4rem;}
	.mt-left .copy .t3{font-size:5rem;}
}
@media (max-width:1024px){
	#maintop > .inner {height:auto;}
	.mt-left { width:100%;}
	.mt-left .copy {text-align:center; margin-top:5rem;}
	.mt-left .mt-search {margin-top:5rem;}
	.mt-left .mt-search > div {margin-left:4rem; width: calc(100% - 10rem);}
	.mt-left .mt-search > div:before {left: -2rem;}
	.mt-left .mt-search > div > input[type="text"] {padding: 0 3rem 0 7rem;}
	.mt-right { width:100%; margin-top:5rem;}
	.mt-left > ul {width:100%; justify-content:center;}
	.mt-left > ul li {margin:0 2rem;}
}
@media (max-width:768px){
	.mt-left > ul li {margin:0 2rem;}
	.mt-right  { position:relative; padding:0 1rem 3rem 1rem;}
	.mt-right .cal-wrap {padding:3rem 2rem;}
	.mt-right .cal-deco {display:none;}
	.cal .tit {padding:0 4rem;}
	.cal .tit h3 {margin-left:0;}
}
@media (max-width:480px){
	.mt-left .copy .t1{font-size:2rem;}
	.mt-left .copy .t2{font-size:3rem; margin-top:1rem;}
	.mt-left .copy .t3{font-size:3.6rem; margin-top:1rem;}
	.mt-left > ul {flex-wrap:wrap; margin-top:2rem;}
	.mt-left > ul li {margin:0.5rem 0.5rem; width:calc(50% - 1rem);}
	.mt-left > ul li a {width:100%; flex-direction: row; height:6rem;}
	.mt-left > ul li a:before {margin:0;}
	.cal .tit {flex-direction: column;}
}



#mainguide {position:relative; margin-top:-5rem; z-index:1}
#mainguide .inner {display:flex; justify-content:flex-end;}
#mainguide .inner:after {display:none;}
.userguide {position:relative; width:77rem; padding:4rem 6rem; box-sizing:border-box; z-index:1; border-radius:3rem 15rem 15rem 15rem; transform: translateX(4rem); display:flex; flex-wrap:wrap; justify-content: space-between;
background: -webkit-gradient(linear, left top, right top, color-stop(0, #93398d), color-stop(1, #464599));
	background: -moz-linear-gradient(to left, #93398d 0%, #464599 100%);
	background: -webkit-linear-gradient(to left,  #93398d 0%, #464599 100%);
	background: -o-linear-gradient(to left,  #93398d 0%, #464599 100%);
	background: -ms-linear-gradient(to left,  #93398d 0%, #464599 100%);
	background: linear-gradient(to left,  #93398d 0%, #464599 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#93398d', endColorstr='#464599', gradientType=1);
}
.userguide:before {content:''; display:block; width:20rem; height:10rem; background:url(/amlib/portal/img/main/guideimg.png) no-repeat right bottom / contain;  position:absolute; bottom:1rem; left:-13rem;}
.userguide .title {width:calc(30% - 4rem);}
.userguide .title h3 {font-size:2.4rem; color:#fff; font-family: 'ONE-Mobile-Title'; margin-bottom:2rem;}
.userguide .title > div {position:relative; font-size:1.6rem;}
.userguide .title > div a.current {background:#fff;border-radius:1rem; padding:1rem 2rem; display:block; position:relative;}
.userguide .title > div a.current:after {content:'\ea4e'; display:block; width:2rem; height:2rem; font-family: remixicon !important; font-style: normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; position:absolute; top:calc(50% - 1rem); right:1rem;}
.userguide .title > div ul {display:none; position:absolute; top:0; left:0; background:#333; width:100%;border-radius:1rem; padding:1rem;}
.userguide .title > div ul li a {color:#fff; margin:1rem; display:block;}

.userguide .guidecon {color:#fff; font-size:1.6rem; width:70%;}
.userguide .guidecon ul li {display:flex; flex-wrap:wrap; justify-content: space-between; margin-bottom:1rem;}
.userguide .guidecon ul li strong {width:8rem;}
.userguide .guidecon ul li span {width:calc(100% - 10rem);}
.userguide .guidecon p.caution {color:#e2ffaa; font-size:1.6rem; margin-top:2rem;}
.userguide .guidecon .ggcon {display:none;}
.userguide .guidecon .ggcon.active {display:block;}

.userloca {position:relative; width:30rem;  z-index:2;}
.userloca a {display:flex; align-items:center; justify-content:center; background:#0c817a; box-sizing:border-box; z-index:1; border-radius: 15rem 3rem 15rem 15rem; height:100%; font-size:2.4rem; font-family: 'ONE-Mobile-Title'; color:#fff;}
.userloca a span:before {content:''; display:block; width:2.8rem; height:3.4rem; background:url(/amlib/portal/img/main/locaimg.png) no-repeat 50% 50% / contain; margin:0 auto 2rem;}
.userloca a:after {content:'+'; width:6rem; height:6rem; color:#fff; position:absolute; bottom:0; right:0; background:#0c817a; display:flex; align-items: center; justify-content: center; border-radius:50%; border:0.7rem solid #fff; font-size:4rem; font-weight:400; font-family: 'Paperlogy';}

@media (max-width:1024px){	
	#mainguide { margin-top:3rem;}
	#mainguide .inner {flex-wrap:wrap;}
	.userguide {width:calc(100% - 30rem); transform: translateX(0); border-radius:3rem 0 0 3rem;}
	.userguide:before {position:absolute; bottom:auto; top:-2rem; left:auto; right:0;}
	.userguide .title {width:100%;}
	.userguide .guidecon {width:100%; margin-top:2rem;}
	.userloca {width:30rem;}
	.userloca a {border-radius:0 3rem 10rem 0;}
	.userguide .guidecon ul {display:flex; flex-wrap:wrap;}
	.userguide .guidecon ul li {width:50%; flex-wrap:wrap; min-width:25rem;}
}
@media (max-width:768px){	
	.userguide {padding:3rem; width:70%;} 
	.userloca {width:30%;}
	.userloca a { text-align:Center; padding:0 1rem;}
}
@media (max-width:480px){	
	.userguide {width:100%; border-radius:3rem 3rem 0 0;}
	.userloca {width:100%;}
	.userloca a { border-radius:0 0 5rem 3rem; padding:2rem 0;}
	.userloca a span {line-height:2em;}
	.userloca a span:before {display:inline-block; margin:0 1rem 0 0; transform: translateY(1rem);}
}

#mainnews {position:relative; margin-top:5rem;}
#mainnews .inner {display:flex; flex-wrap:wrap; align-items:flex-end; justify-content: space-between; min-height:auto;}
#mainnews .inner:before {content:''; width:50rem; height:50rem; background:url(/amlib/portal/img/main/sec3bg.png) no-repeat 50% 50% / contain; position:absolute; top:-30rem; left:-30rem; opacity:0.2;}
#mainnews .inner:after {display:none;}

.popupzone {width:56.5rem; overflow:hidden; border-radius:3rem 15rem 3rem 3rem;}
.popupzone .popupzone-slide { overflow:hidden;}
.popupzone .popupzone-slide img {width:100%;}
.popupzone .tit {display:flex; position:relative; background:#4e5d73; border-radius:0 0 3rem 3rem; padding:2rem 3rem; color:#fff;}
.popupzone .tit h3 {position:absolute; bottom:0; right:0; text-transform: uppercase; display:flex; width:23rem; justify-content: center; align-items:center; height:8rem; border-radius:3rem 0 0 0;
background: -webkit-gradient(linear, left top, right top, color-stop(0, #0165d8), color-stop(1, #3aa7b8));
	background: -moz-linear-gradient(to left, #0165d8 0%, #3aa7b8 100%);
	background: -webkit-linear-gradient(to left,  #0165d8 0%, #3aa7b8 100%);
	background: -o-linear-gradient(to left,  #0165d8 0%, #3aa7b8 100%);
	background: -ms-linear-gradient(to left,  #0165d8 0%, #3aa7b8 100%);
	background: linear-gradient(to left,  #0165d8 0%, #3aa7b8 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#0165d8', endColorstr='#3aa7b8', gradientType=1);}
.popupzone .tit h3 span {padding-left:5rem; background:url(/amlib/portal/img/main/popupzoneh3.png) no-repeat 0 50%; line-height:3rem; font-weight:700;}
.popupzone .tit h3 em {color:#ffe7b5;}
.popupzone .tit .controll {display:flex; width:calc(100% - 23rem);  justify-content: space-between; align-items:center;}
.popupzone .tit .controll .count {font-size:1.4rem; font-weight:400; position:relative;}
.popupzone .tit .controll .count:after {content:''; display:block; width:8rem; height:1px; background:#fff; position:absolute; top:50%; left:7rem; opacity:0.2;}
.popupzone .tit .controll .count .current {font-weight:800;}
.popupzone .tit .controll > div {display:flex; justify-content: space-between;}
.popupzone .tit .controll button {color:#fff; width:3rem; height:3rem; border-radius:50%; display:flex; align-items:center; justify-content: center; margin-left:0.5rem; position:relative;}
.popupzone .tit .controll button span {text-indent:-9999px;}
.popupzone .tit .controll button.prev-slide,
.popupzone .tit .controll button.next-slide {width:auto; margin:0 0.5rem;}
.popupzone .tit .controll button.prev-slide:after {content:''; display:inline-block; width:1px; height:1rem; background:#fff; opacity:0.2; position:absolute; top:calc(50% - 0.6rem); right:-0.5rem;}
.popupzone .tit .controll button.start-slide,
.popupzone .tit .controll button.stop-slide {background:#333;}

.notice {width:calc(100% - 64rem); position:relative;}
.notice h3 {color:#000; font-size:2.8rem; font-family: 'ONE-Mobile-Title'; margin-bottom:3rem;}
.notice h3 span {color:#017ad8;}
.notice h3 span:after {content:''; display:inline-block; width:10rem; height:10rem; background:url(/amlib/portal/img/main/noticeimg.png)no-repeat 0 bottom / contain;}
.notice ul li {margin-top:1rem; padding:2px; background:#f9f9f9;border-radius:2rem; transition:all .2s;}
.notice ul li:hover {
background: -webkit-gradient(linear, left top, right top, color-stop(0, #028f49), color-stop(1, #15377f));
	background: -moz-linear-gradient(to left, #028f49 0%, #15377f 100%);
	background: -webkit-linear-gradient(to left,  #028f49 0%, #15377f 100%);
	background: -o-linear-gradient(to left,  #028f49 0%, #15377f 100%);
	background: -ms-linear-gradient(to left,  #028f49 0%, #15377f 100%);
	background: linear-gradient(to left,  #028f49 0%, #15377f 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#028f49', endColorstr='#15377f', gradientType=1);
	
}
.notice ul li a {background:#f9f9f9; display:flex; justify-content: space-between;  align-items:center; padding:2rem;  font-size:1.6rem; font-weight:600; color:#000; border-radius:1.8rem;} 
.notice ul li a span.tt {position:relative; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; width:calc(100% - 10rem);}
.notice ul li a span.tt em {background:#fff; padding:0.5rem 1.5rem; border-radius:3rem; font-size:1.4rem; margin-right:1rem; font-weight:500; display:inline-block;}
.notice ul li a span.date {color:#666; font-size:1.4rem; width:10rem; text-align:right;}

.notice a.more {position:absolute; top:5.5rem; right:0; padding:1.2rem 2.4rem; font-size:1.6rem; color:#333; background:#f8f8f8; border-radius:5rem; display:flex; align-items:center;}
.notice a.more:after {content:'+'; margin-left:1rem; font-weight:600; font-size:2rem;}
.notice a.more:hover {background:#333; color:#fff;}

@media (max-width:1024px)  {
	.popupzone {width:50%; border-radius:3rem 10rem 3rem 3rem;}
	.popupzone .tit .controll .count:after {display:none;}
	.notice {width:calc(50% - 4rem);}
	.notice h3 {margin-bottom:2rem; font-size:2.4rem;}
	.notice h3 span:after {display:none;}
	.notice ul li:last-child {display:none;}
	.notice a.more {position:relative; top:0; right:0; margin-top:1rem; background:#333; color:#fff; justify-content: center;}
}
@media (max-width:768px){
	.popupzone {width:100%; border-radius:3rem 5rem 3rem 3rem;}
	.notice h3 {text-align:center;}
	.notice {width:100%; margin-top:4rem;}
}
@media (max-width:480px){
	.popupzone .tit .controll .count {display:none;}
}


#mainlink {position:relative; margin-top:7rem;}
#mainlink .inner:after {display:none;}
.mainlink-wrap {display:flex; flex-wrap:wrap; align-items:center; justify-content: space-between;}
.mainlink-wrap button {width:5rem; height:5rem; border-radius:50%; border:1px solid #dedede;}
.mainlink-wrap button span {display:inline-block; text-indent:-9999px;}
.mainlink-wrap button i {font-size:2.4rem;}
.mainlink-wrap ul {width:calc(100% - 14rem); }
.mainlink-wrap ul li {padding:1rem 2rem;}
.mainlink-wrap ul li a { display:block; text-align:center;border-radius:3rem; padding:3px; transition:all 0.5s;}
.mainlink-wrap ul li a span {display:block; background:#f8f9fb; padding:3rem 1rem; border-radius:2.7rem; transition:all 0.5s;}
.mainlink-wrap ul li a span:before {content:''; width:6rem; height:6rem; background:#ff000020; display:block; margin:0 auto;}

.mainlink-wrap ul li a:hover { transform: translateY(-1rem); border-radius:3rem 3rem 1rem 3rem;
	background: -webkit-gradient(linear, left top, right top, color-stop(0, #028f49), color-stop(1, #15377f));
	background: -moz-linear-gradient(to left, #028f49 0%, #15377f 100%);
	background: -webkit-linear-gradient(to left,  #028f49 0%, #15377f 100%);
	background: -o-linear-gradient(to left,  #028f49 0%, #15377f 100%);
	background: -ms-linear-gradient(to left,  #028f49 0%, #15377f 100%);
	background: linear-gradient(to left,  #028f49 0%, #15377f 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#028f49', endColorstr='#15377f', gradientType=1);}
.mainlink-wrap ul li a:hover span {border-radius:2.7rem 2.7rem 0.7rem 2.7rem; background:#fff;}


.mainlink-wrap ul li a.ml01 span:before {background:url(/amlib/portal/img/main/ml01.png) no-repeat 50% 50%;}
.mainlink-wrap ul li a.ml02 span:before {background:url(/amlib/portal/img/main/ml02.png) no-repeat 50% 50%;}
.mainlink-wrap ul li a.ml03 span:before {background:url(/amlib/portal/img/main/ml03.png) no-repeat 50% 50%;}
.mainlink-wrap ul li a.ml04 span:before {background:url(/amlib/portal/img/main/ml04.png) no-repeat 50% 50%;}
.mainlink-wrap ul li a.ml05 span:before {background:url(/amlib/portal/img/main/ml05.png) no-repeat 50% 50%;}
.mainlink-wrap ul li a.ml06 span:before {background:url(/amlib/portal/img/main/ml06.png) no-repeat 50% 50%;}
.mainlink-wrap ul li a.ml07 span:before {background:url(/amlib/portal/img/main/ml07.png) no-repeat 50% 50%;}
.mainlink-wrap ul li a.ml08 span:before {background:url(/amlib/portal/img/main/ml08.png) no-repeat 50% 50%;}

@media (max-width:768px) {
	#mainlink {margin-top:5rem;}
	.mainlink-wrap button {width:4rem; height:4rem}
	.mainlink-wrap ul {width:calc(100% - 8rem); }
	.mainlink-wrap ul li {padding:1rem 0.5rem;}
	.mainlink-wrap ul li a:hover { transform:initial;}
}

#lecture {position:relative; }
#lecture .inner:after {display:none;}
#lecture .inner {position:relative;}
#lecture h3 {font-size:2.4rem; color:#191d2b; font-family: 'ONE-Mobile-Title'; position:relative; padding-top:15rem;}
#lecture h3 span {position:relative; z-index:1; display:block;}
#lecture h3 span:nth-child(2) {font-size:4rem;  margin-top:1rem;}
#lecture h3 span em {color:#e72b72; }

#lecture h3:before {content:''; display:block; width:137rem; height:23.9rem; background:url(/amlib/portal/img/main/lecture-01.png) no-repeat right 0 / contain; z-index:0; position:absolute; top:0; right:-27.5rem;}

#lecture .lecture-wrap {margin-top:5rem;}
#lecture .lecture-slide {position:relative; width:calc(100% + 5.9rem); margin-left:-2rem; z-index:1;}
#lecture .lecture-slide > * {position:relative; z-index:1;}
#lecture .lecture-slide:after {content:''; display:block; width:19.7rem; height:24.7rem; background:url(/amlib/portal/img/main/lecture-02.png) no-repeat 0 bottom / contain; z-index:0; position:absolute; bottom:-4.6rem; right:-11rem;}
#lecture .lecture-slide .items {padding:0 3rem; position:relative;}
#lecture .lecture-slide .items a {position:relative; color:#333; display:block; width:100%;}
#lecture .lecture-slide .items:after {content:''; display:block; border-right:1px dashed #dedede; height:70%; width:1px; position:absolute; top:15%; right:0;}
#lecture .lecture-slide a {display:block; }
#lecture p.state span {display:inline-block; padding:1rem 1rem; background:#000; color:#fff; border-radius:4rem; font-size:1.4rem; width:10rem; text-align:center;}
#lecture p.state span.doing {background:#e72b72;}
#lecture p.state span.ready {background:#019549;}
#lecture p.state span.watingReady {background:#1db895;}
#lecture p.state span.end {opacity:0.2;}
#lecture p.tit {margin:2rem 0; font-weight:600; font-size:2.4rem; text-overflow: ellipsis; height:1em; line-height:1em; display: -webkit-box; overflow:hidden; -webkit-line-clamp: 1; -webkit-box-orient: vertical; }

#lecture ul {font-size:1.6rem;}
#lecture ul li {position:relative; display:flex; flex-wrap:wrap; justify-content: space-between; margin:1rem 0; }
#lecture ul li strong {width:4em; align-content: center; padding-left:2.5rem;}
#lecture ul li strong:before {content:''; display:block; width:2rem; height:2rem; position:absolute; top:0; left:0;}
#lecture ul li:nth-of-type(1) strong:before {background:url(/amlib/portal/img/main/lecture-icon01.png) no-repeat 50% 50% / contain;}
#lecture ul li:nth-of-type(2) strong:before {background:url(/amlib/portal/img/main/lecture-icon02.png) no-repeat 50% 50% / contain;}
#lecture ul li:nth-of-type(3) strong:before {background:url(/amlib/portal/img/main/lecture-icon03.png) no-repeat 50% 50% / contain;}
#lecture ul li span {width:calc(100% - 5em); align-content: center;}

#lecture .lecture-slide .items a:hover p.tit {text-decoration: underline;}
#lecture .lecture-slide .items a:hover:after {content:''; display:block; width:5rem; height:5rem; position:absolute; bottom:0; right:2rem; background:url(/amlib/portal/img/contents/book-hover.png) no-repeat 50% 50% / contain;}

#lecture .controll {display:flex; justify-content: flex-end; align-items:center; margin-top:4rem; z-index:2; position:relative;}
#lecture .controll:before {content:''; display:inline-block; width:calc(100% - 15rem); height:0.4rem; background:#333;}
#lecture .controll > div{display:flex; justify-content: flex-end; background:#fff; box-shadow: 2px 2px 1rem rgba(0,0,0,0.2); border-radius:6rem; position:relative; margin-right:-1rem;}
#lecture .controll > div:after {content:''; display:block; width:1px; height:1rem; background:#dedede; position:absolute; top:calc(50% - 0.5rem); left:50%;}
#lecture .controll button {color:#333; width:4rem; height:6rem; display:flex; align-items:center; justify-content: center; position:relative; }
#lecture .controll button i {font-size:2rem;}
#lecture .controll button span {text-indent:-9999px;}
#lecture .controll button.prev-slide {margin-left:1rem;}
#lecture .controll button.next-slide {margin-right:1rem;}
#lecture .controll a {background:#000 url(/amlib/portal/img/main/lecturemore.png) no-repeat 50% 50%; width:6rem; height:6rem; border-radius:50%; text-indent: -9999px;}


.controll button i {opacity:0.7; transition: all .2s;}
.controll button:hover i {opacity:1; transform: scale(1.2);} 
@media (max-width:1600px) {
	/* #lecture h3 {z-index:3;} */
	#lecture .lecture-slide:after { bottom:auto; top:-20rem; right:0; }
}
@media (max-width:768px) {
	#lecture h3 {text-align:center; padding-top:5rem;}
	#lecture h3 span:nth-child(2) {font-size:2.9rem;}
	#lecture h3:before {width:100%; height:10rem; background:url(/amlib/portal/img/main/lecture-01.png) no-repeat right 0 / contain; z-index:0; position:absolute; top:0; right:0;}
	#lecture .lecture-slide:after {display:none;}
	#lecture .lecture-wrap {margin-top:3rem;}
	#lecture .controll {margin-top:2rem;}
}

#book {position:relative; margin-top:5rem; }

#book > .inner:after{display:none;}
#book h3 {font-size:2.4rem; color:#191d2b; font-family: 'ONE-Mobile-Title'; position:relative; }
#book h3 span {position:relative; z-index:1; display:block;}
#book h3 span:nth-child(1):after {content:''; display:inline-block; width:12.3rem; height:10.2rem; background:url(/amlib/portal/img/main/booktitbg.png) no-repeat 0 bottom / contain;}
#book h3 span:nth-child(2) {font-size:4rem; margin-top:1rem;}
#book h3 span em {color:#0166d8; }

.bookwrap {display:flex; flex-wrap:wrap; justify-content: space-between;}
.bookwrap .bookLeft {width:50rem; padding-bottom:16rem; position:relative;}
.bookwrap .bookLeft > * {position:relative; z-index:1;}
.bookwrap .bookLeft:before {content:''; display:block; width:256.0rem; height:100%;   position:absolute; bottom:0; left:-55rem; background:url(/amlib/portal/img/main/bookbg.png) no-repeat 50% bottom; z-index:0;}

.bookwrap .bookLeft .booktit {font-size:2.4rem; font-weight:600; margin-top:7rem; width:30rem;}
.bookwrap .bookLeft .booktit a {display:block;}
.bookwrap .bookLeft .booktit a span { display:block; padding:1rem 0; color:#b0b0b0;}
.bookwrap .bookLeft .booktit a:nth-of-type(1) {margin-bottom:2rem;}
.bookwrap .bookLeft .booktit a:nth-of-type(1) span {border-bottom:3px solid #333; position:relative; color:#000;}
.bookwrap .bookLeft .booktit a:nth-of-type(1) span:after {content:''; display:block; width:6.2rem; height:7.6rem; position:absolute; bottom:0; right:0; background:url(/amlib/portal/img/main/bookbg1.png) no-repeat 0 bottom / contain;}
.bookwrap .bookRight {width:calc(100% + 25rem); position:absolute; top:5rem; left:calc(30% + 5rem);}
.bookwrap .bookLeft .booktit a:hover span {color:#000;}

.bookwrap .controll {display:flex; align-items:center; justify-content: space-between; margin-top:3rem; width:30rem;}
.bookwrap .controll > div {display:flex; align-items:center;}
.bookwrap .controll > div button {width:2rem; height:2rem; display:flex; align-items:center; justify-content: center; overflow:hidden;}
.bookwrap .controll > div i {font-size:2.4rem;}
.bookwrap .controll > div .count {margin:0 0.5rem; font-size:1.6rem; line-height:1em;}
.bookwrap .controll > div .count .current {font-weight:700;}
.bookwrap .controll > div button span {text-indent:-9999px; display:inline-block;}
.bookwrap .controll > div:nth-of-type(2) a,
.bookwrap .controll > div:nth-of-type(2) button {width:6.4rem; height:6.4rem; border-radius:50%; background:#fff; box-shadow:0 0 1rem rgba(0,0,0,0.1);}
.bookwrap .controll > div:nth-of-type(2) button i {font-size:3rem;}
.bookwrap .controll > div:nth-of-type(2) button.stop-slide i {font-size:2.5rem; font-weight:700;}
.bookwrap .controll > div:nth-of-type(2) button.start-slide i {font-size:2.2rem;}
.bookwrap .controll > div:nth-of-type(2) a {background:#272e40 url(/amlib/portal/img/main/bookmore.png) no-repeat 50% 50%; text-indent:-9999px; margin-left:1rem;}

.book-slide .items {margin-right:4.5rem; padding-top:5rem; transition:all .2s; width:30rem;}
.book-slide .items:nth-child(odd) {transform:translateY(-5rem);}
.book-slide .items p.thum {width:30rem; height:41.2rem; position:relative;}
.book-slide .items.slick-current p.thum:after {content:''; display:block; width:5.3rem; height:5.8rem; background:url(/amlib/portal/img/main/book-current.png)no-repeat 0 0 / contain; position:absolute; bottom:-5.8rem; right:2rem;}
.book-slide .items p.thum img {width:100%; height:100%;border-radius:2rem; }
.book-slide .items p.tit {font-size:2rem; color:#000; margin-top:2rem; font-weight:600; transition:all .2s;}
.book-slide .items p.copy {font-size:1.6rem; color:#333; margin-top:2rem; font-weight:600;}
.book-slide .items.slick-current .tit {width:calc(100% - 8rem); }
.footerWrap {margin-top:8rem;}
.book-slide .items a:hover .tit {color:#0165d8; text-decoration: underline;}

@media (max-width:1280px) {
	.bookwrap { justify-content:center; align-items:center; flex-direction: column;} 
	.bookwrap .bookLeft {width:100%; display:flex; padding-bottom:0;  flex-wrap:wrap; align-items: flex-end; justify-content: space-between; margin-bottom:5rem;}
	.bookwrap .bookLeft:before {display:none;}
	.bookwrap .bookLeft .booktit {display:none;}
	.bookwrap .bookLeft .controll {margin-top:0; width:auto;}
	.bookwrap .bookLeft .controll > div {margin-right:3rem;}
	.bookwrap .bookRight {width:100%; position:relative; left:0; top:auto;}
	/* .bookwrap .bookLeft h3 {width:100%;} */
}
@media (max-width:768px) {
	.bookwrap .bookLeft {flex-direction: column; align-items: center; margin-bottom:2rem;}
	.bookwrap .bookLeft h3 {text-align:center;}
	#book h3 span:nth-child(2) {font-size:2.9rem;}
	.bookwrap .bookLeft .controll {margin-top:3rem; }
	.book-slide .items {width:32rem; margin-right:2rem; transform:translateY(-5rem)!important;}
	.book-slide .items p.thum {width:32rem; height:auto;}
}