@charset "utf-8";
/* -----------------------------------------------
	* 대문 스타일 정의
--------------------------------------------------
	- 최초 작성일 : 2021.08.15
	- 최초 작성자 : 아보카도
	- 최종 수정일 : 
	- 최종 수정자 : 
--------------------------------------------------*/



/*********************************
	개인디자인 - 1920
**********************************/

body {background-image : url('http://border.dothome.co.kr/img/back.png');}

.acce img {position: fixed;}

.acce .left {left:0;}
.acce .right {right:0;}
.acce .top {top:0;}
.acce .bottom {bottom:0;}
.acce .center {left:0; right:0; margin:0 auto;}

.title {
	position: relative; 
	top: 25vh; 
	text-align: center;
	animation: fadein 5s;
}

		
.text {bottom:6%;}
.polaroid4 {right:4%;}
.polaroid2 {top:7%;}
.sunflower2 {right:2%;}
.sticker2 {top:2%;}
.sticker1 {left: 3%;}
.watercolor2 {right:12%;bottom:13%;}
.watercolor1 {left:5%;top:22%;}


.acce .animefade3 {animation: fadein 3s;}
.acce .animefade2 {animation: fadein 2s;}


.acce .animeleft4 {animation: left 4s ease 1;}
.acce .animeright4 {animation: right 4s ease 1;}
.acce .animeleft3 {animation: left 3s ease 1;}
.acce .animeright3 {animation: right 3s ease 1;}
.acce .animeleft2 {animation: left 2s ease 1;}
.acce .animeright2 {animation: right 2s ease 1;}
.acce .animeleft1 {animation: left 1s ease 1;}
.acce .animeright1 {animation: right 1s ease 1;}

@keyframes top {0% {top:-20%;} }
@keyframes bottom {0% {bottom:-20%;} }
@keyframes left {0% {left:-20%;} }
@keyframes right {0% {right:-20%;} }
@keyframes rotate_image{100% {transform: rotate(360deg);}}
@keyframes fadein {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}


/*********************************
	모바일
**********************************/

@media screen and (max-width: 1024px) {

.acce .none {display:none;}
.acce .mobi1 {width:100px;}
.acce .mobi2 {width:200px;}
.acce .mobi3 {width:300px;}
.acce .mobi4 {width:400px;}

}



/*********************************
	인트로 스타일 정의
**********************************/

html, body {height:100%; margin:0; padding:0;}

.wrapper {display:table; width:100%; height:100%; position:relative; z-index:1;}
.wrapper > .inner {display:table-cell; vertical-align:middle; text-align:center;}

.index-logo {display:block; padding:10px; margin-top:-80px; word-break:keep-all; text-align:center; font-size:14px; padding-bottom:23px;}
.index-logo img {max-width:70%;}
.index-logo p {padding:10px 0;}

.index-logo a {display:inline-block; text-decoration:none;}

@media all and (max-width:640px) { .index-logo {font-size:14px;} }
@media all and (max-width:480px) { .index-logo {font-size:13px;} }
@media all and (max-width:380px) { .index-logo {font-size:12px;} }