First Commit
This commit is contained in:
263
web/html/theme/FT_WEB20/css/jquery.fullPage.css
Normal file
263
web/html/theme/FT_WEB20/css/jquery.fullPage.css
Normal file
@ -0,0 +1,263 @@
|
||||
/*!
|
||||
* fullPage 2.9.7
|
||||
* https://github.com/alvarotrigo/fullPage.js
|
||||
* MIT licensed
|
||||
*
|
||||
* Copyright (C) 2013 alvarotrigo.com - A project by Alvaro Trigo
|
||||
*/
|
||||
html.fp-enabled,
|
||||
.fp-enabled body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
overflow:hidden;
|
||||
|
||||
/*Avoid flicker on slides transitions for mobile phones #336 */
|
||||
-webkit-tap-highlight-color: rgba(0,0,0,0);
|
||||
}
|
||||
.fp-section {
|
||||
position: relative;
|
||||
-webkit-box-sizing: border-box; /* Safari<=5 Android<=3 */
|
||||
-moz-box-sizing: border-box; /* <=28 */
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.fp-slide {
|
||||
float: left;
|
||||
}
|
||||
.fp-slide, .fp-slidesContainer {
|
||||
height: 100%;
|
||||
display: block;
|
||||
}
|
||||
.fp-slides {
|
||||
z-index:1;
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
-webkit-transition: all 0.3s ease-out; /* Safari<=6 Android<=4.3 */
|
||||
transition: all 0.3s ease-out;
|
||||
}
|
||||
.fp-section.fp-table, .fp-slide.fp-table {
|
||||
display: table;
|
||||
table-layout:fixed;
|
||||
width: 100%;
|
||||
}
|
||||
.fp-tableCell {
|
||||
display: table-cell;
|
||||
vertical-align: middle;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.fp-slidesContainer {
|
||||
float: left;
|
||||
position: relative;
|
||||
}
|
||||
.fp-controlArrow {
|
||||
-webkit-user-select: none; /* webkit (safari, chrome) browsers */
|
||||
-moz-user-select: none; /* mozilla browsers */
|
||||
-khtml-user-select: none; /* webkit (konqueror) browsers */
|
||||
-ms-user-select: none; /* IE10+ */
|
||||
position: absolute;
|
||||
z-index: 4;
|
||||
top: 50%;
|
||||
cursor: pointer;
|
||||
width: 0;
|
||||
height: 0;
|
||||
border-style: solid;
|
||||
margin-top: -38px;
|
||||
-webkit-transform: translate3d(0,0,0);
|
||||
-ms-transform: translate3d(0,0,0);
|
||||
transform: translate3d(0,0,0);
|
||||
}
|
||||
.fp-controlArrow.fp-prev {
|
||||
left: 15px;
|
||||
width: 0;
|
||||
border-width: 38.5px 34px 38.5px 0;
|
||||
border-color: transparent #fff transparent transparent;
|
||||
}
|
||||
.fp-controlArrow.fp-next {
|
||||
right: 15px;
|
||||
border-width: 38.5px 0 38.5px 34px;
|
||||
border-color: transparent transparent transparent #fff;
|
||||
}
|
||||
.fp-scrollable {
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
}
|
||||
.fp-scroller{
|
||||
overflow: hidden;
|
||||
}
|
||||
.iScrollIndicator{
|
||||
border: 0 !important;
|
||||
}
|
||||
.fp-notransition {
|
||||
-webkit-transition: none !important;
|
||||
transition: none !important;
|
||||
}
|
||||
|
||||
|
||||
/* nav custom */
|
||||
|
||||
#fp-nav {
|
||||
position: fixed;
|
||||
z-index: 100;
|
||||
top:50%;
|
||||
right:20px;
|
||||
opacity: 1;
|
||||
width:100px;
|
||||
}
|
||||
#fp-nav.last{
|
||||
right: -300px !important;
|
||||
}
|
||||
#fp-nav.fp-right {
|
||||
right: 50px;
|
||||
}
|
||||
#fp-nav.fp-left {
|
||||
left: 50px;
|
||||
}
|
||||
|
||||
#fp-nav ul {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
#fp-nav ul li{
|
||||
display: block;
|
||||
width:20px;
|
||||
height:20px;
|
||||
margin:15px 0;
|
||||
position:relative;
|
||||
}
|
||||
|
||||
#fp-nav ul li a {
|
||||
display: block;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
cursor: pointer;
|
||||
text-decoration: none;
|
||||
}
|
||||
#fp-nav ul li a:before{
|
||||
content: '';
|
||||
display: block;
|
||||
width:20px;
|
||||
height:20px;
|
||||
border:1px solid #fff;
|
||||
border-radius: 100%;
|
||||
position: absolute;
|
||||
left: 52%;
|
||||
top: 52%;
|
||||
transform: translate(-50%,-50%) scale(0);
|
||||
transition: all 0.25s ease;
|
||||
}
|
||||
#fp-nav.color ul li a.active::before{
|
||||
border:1px solid #333;
|
||||
}
|
||||
#fp-nav.color ul li a.active::before{
|
||||
border:1px solid #333;
|
||||
}
|
||||
#fp-nav.color ul li a span {
|
||||
background:#333;
|
||||
}
|
||||
/* 덮이는 영역잡기 -> 클릭범위 늘리기 */
|
||||
#fp-nav ul li a:after{
|
||||
content: '';
|
||||
display: block;
|
||||
height: 30px;
|
||||
position: absolute;
|
||||
right: 0%;
|
||||
top: 0%;
|
||||
}
|
||||
/* 테두리원그리기 */
|
||||
#fp-nav ul li a.active:before{
|
||||
transform: translate(-50%,-50%) scale(1);
|
||||
}
|
||||
#fp-nav ul li a.active span,
|
||||
#fp-nav ul li:hover a.active span{
|
||||
height:5px;
|
||||
width:5px;
|
||||
margin: -2px 0 0 -2px;
|
||||
border-radius: 100%;
|
||||
opacity: 1;
|
||||
}
|
||||
#fp-nav ul li a span{
|
||||
border-radius: 50%;
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
height:5px;
|
||||
width:5px;
|
||||
border: 0;
|
||||
background: #fff;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
opacity: 0.5;
|
||||
margin: -2px 0 0 -2px;
|
||||
-webkit-transition: all 0.25s ease;
|
||||
-moz-transition: all 0.25s ease;
|
||||
-o-transition: all 0.25s ease;
|
||||
transition: all 0.25s ease;
|
||||
}
|
||||
#fp-nav ul li:hover a span{
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
margin: -2px 0px 0px -2px;
|
||||
}
|
||||
#fp-nav.black ul li a span{background-color:#555}
|
||||
#fp-nav.black ul li a.active{border-color:#555}
|
||||
|
||||
#fp-nav ul li .fp-tooltip {
|
||||
position: absolute;
|
||||
top:20%;
|
||||
color: #fff;
|
||||
font-size: 14px;
|
||||
font-family: "Roboto","Noto Sans KR";
|
||||
white-space: nowrap;
|
||||
max-width: 220px;
|
||||
overflow: hidden;
|
||||
display: block;
|
||||
opacity: 0.5;
|
||||
width: auto;
|
||||
cursor: pointer;
|
||||
transform:translateX(-80px);
|
||||
}
|
||||
#fp-nav ul li .fp-tooltip.active {
|
||||
opacity:1;
|
||||
}
|
||||
#fp-nav ul li:hover .fp-tooltip,
|
||||
#fp-nav.fp-show-active a.active + .fp-tooltip {
|
||||
-webkit-transition: opacity 0.2s ease-in;
|
||||
transition: opacity 0.2s ease-in;
|
||||
width: auto;
|
||||
opacity: 1;
|
||||
}
|
||||
#fp-nav ul li .fp-tooltip.fp-right {
|
||||
right: 50px;
|
||||
}
|
||||
#fp-nav ul li .fp-tooltip.fp-left {
|
||||
left: 20px;
|
||||
}
|
||||
.fp-auto-height.fp-section,
|
||||
.fp-auto-height .fp-slide,
|
||||
.fp-auto-height .fp-tableCell{
|
||||
height: auto !important;
|
||||
}
|
||||
|
||||
.fp-responsive .fp-auto-height-responsive.fp-section,
|
||||
.fp-responsive .fp-auto-height-responsive .fp-slide,
|
||||
.fp-responsive .fp-auto-height-responsive .fp-tableCell {
|
||||
height: auto !important;
|
||||
}
|
||||
|
||||
/*Only display content to screen readers*/
|
||||
.fp-sr-only{
|
||||
position: absolute;
|
||||
width: 1px;
|
||||
height: 1px;
|
||||
padding: 0;
|
||||
overflow: hidden;
|
||||
clip: rect(0, 0, 0, 0);
|
||||
white-space: nowrap;
|
||||
border: 0;
|
||||
}
|
||||
#fp-nav li:last-child{
|
||||
display: none;
|
||||
}
|
||||
Reference in New Issue
Block a user