@charset "utf-8";
/* CSS Document */




.intro_box {
    width: 1200px;
    margin: 0 auto;
	clear:both;
	}
.intro_box .intro_section {
    position: relative;
    text-align: center;
	padding:50px 0;
}
.intro_box .point_text {
    display: inline-block;
    position: relative;
    margin-bottom: 8px;
    font-size: 15px;
    
    letter-spacing: -.8px;
}


.intro_box .text_intro {
    position: relative;
    overflow: hidden;
    height: auto;
     margin: 0 180px; 
    font-size: 18px;
    font-weight: 300;
    line-height: 1.89;
    letter-spacing: -.6px;
    color: #333;
    word-wrap: break-word;
    word-break: break-all;
}

.intro_box_line {margin-top:40px;}
 @media screen and (max-width: 960px) {
.intro_box{ width: 100%!important; margin: 0 auto;}
.intro_box_line {background: #e1e4e7; height: 10px; margin:0;}
.intro_box .intro_section {padding:30px 0;}
.intro_box .text_intro {margin: 0;} 
}

.inner .summary_btn_more {
    position:relative;
    top: 0;
    right: 0;
    font-size: 15px;
    letter-spacing: -.6px;
    text-align: left;
    color: #666;
	float: right;
}
	
 
	
.inner .summary_btn_more .text {
    vertical-align: middle;
}
.inner .summary_btn_more .icon {
    color: #999;
    vertical-align: middle;
    font-size: 16px;
    margin-left: 2px;
    margin-bottom: -1px;
    font-weight: 700;
}
.uio_title {
    display: inline-block;
    position: relative;
    font-size: 20px;
    margin-bottom: 50px;
    color: #999;
    font-weight: 400;
    letter-spacing: -.8px;
}
.uio_title:after {
    position: absolute;
    left: 0;
    right: 0;
    bottom: -10px;
    content: "";
    width: 1200px;
    height: 1px;
    background-color: #ebebeb
}

.uio_title.type_block {
    display: block
}

.uio_title.type_block:after {
    display: none
}

.uio_title.is_title_none {
    color: #fff!important
}

.uio_title .icon_npay {
    margin: -1px 0 0 5px
}

.uio_title_bullet {
    position: absolute;
    left: 0;
    bottom: -10px;
    width: 100%;
    height: 1px;
    z-index: 1
}

.uio_title_link {
    color: #999
}

.uio_title_link~.uio_title_link {
    margin-left: 16px
}

.uio_title_link~.uio_title_link:before {
    display: inline-block;
    width: 1px;
    height: 20px;
    margin: 0 20px 0 0;
    background-color: #ebebeb;
    vertical-align: top;
    content: "";
    vertical-align: middle
}

/*spot box start */
.spot_box .card-icons a {display:inline-block;}
.spot_box .icon {
    display: table;
    overflow: hidden;
    position: relative;
	padding:5px;
    width: 33px;
    height: 33px;
    background-color: rgba(0,0,0,.3);
    font-family: modoo;
    font-size: 17px;
    line-height: 17px;
    font-weight: 600;
    text-align: center;
    color: #fff;
    letter-spacing: 1px;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;

}
.spot_box .icon2 {
    display: table;
    overflow: hidden;
    position: relative;
	padding:10px;
    width: 43px;
    height: 43px;
    background-color: rgba(0,0,0,.3);
    font-family: modoo;
    font-size: 17px;
    line-height: 17px;
    font-weight: 600;
    text-align: center;
    color: #fff;
    letter-spacing: 1px;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
	border-radius:50%;
	
}
.spot_box .card-icons a {margin-left:5px; text-align:center;}
.spot_box .card-icons a:first-child {margin-left:0;}
.spot_box .card-icons a abbr {color:rgba(255,255,255,.7); line-height:28px; font-size:13px;}
.spot_box .icon2  i {font-size:22px;}

/*spot box end */
	
/*section_spot start*/ 
.section_spot .spot_images {
    position: relative
}

.section_spot .spot_images .img_cover {
    width: 100%;
    height: 400px;
    position: relative;
    -webkit-background-size: cover;
    background-size: cover;
    background-position: 50% 50%;
    background-repeat: no-repeat
}

.section_spot .spot_images .btn_play_area {
    position: absolute;
    top: 114px;
    left: 50%;
    width: 1100px;
    z-index: 100;
    margin-left: -550px;
    text-align: right
}

.section_spot .spot_images .btn_play {
    display: inline-block;
    margin-right: 24px;
    overflow: hidden;
    background-image: url(../img/sp_pc_527220.png);
    width: 65px;
    height: 66px;
    background-position: -278px -436px
}

.section_spot .spot_images.is_hide {
    display: none
}

.section_spot {
	
    display: table;
    position: absolute;
    left: 50%;
    top: 0;
    /*idth: 1000px;*/
    width: 800px;
    height: 400px;
    margin-left: -550px
}

@media screen and (min-width: 1024px) {
/*.spot_section2 {width: 400px;}*/
}

 @media screen and (max-width: 960px) {
	 .section_spot {display: none;}
}

.section_spot .site_thumb {
    display: inline-block;
    float: left;
    position: relative;
    width: 100px;
    height: 100px;
    margin-right: 20px
}

.section_spot .site_thumb img {
    width: 100%;
    -webkit-border-radius: 100%;
    border-radius: 100%
}

.section_spot .site_thumb:after {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    -webkit-border-radius: 100%;
    border-radius: 100%;
    border: 1px solid rgba(0,0,0,.08);
    content: ""
}

.section_spot .site_info {  
    display:inline;
	top:170px;
    position: relative;
    z-index: 10;
    padding-top: 39px;
    vertical-align: middle;
    letter-spacing: -.8px
}

.section_spot .site_name {
    margin-top: 6px;
    font-size: 20px;
    font-weight: 300;
    line-height: 38px;
    color: #fff;
    letter-spacing: -.8px;
    word-wrap: break-word;
    word-break: break-all
}
.section_spot .site_description {
    margin-top: 2px;
    font-size: 15px;
    color: rgba(255,255,255,.8);
    line-height: 25px;
    letter-spacing: -.6px;
    word-wrap: break-word;
    word-break: break-all;
	padding-top: 0;
}

/*.section_spot .site_description,.section_spot .site_name {
    color: #333
}*/


.mask_bg {
    position: absolute;
    z-index: 2;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
	background-color: rgba(0, 0, 0, .35);}
 

/* section_spot end*/




/* spot_info start*/



.spot_box {
    position: relative;
}

.spot_box:before {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0,0,0,.6);
    content: ""
}

.spot_box:after {
    position: absolute;
    right: 18px;
    top: 117px;
    width: 157px;
    height: 230px;
    background-color: #fff;
    content: ""
}

.spot_box .spot_thumb {
    overflow: hidden;
    position: relative;
    height: 230px;
    margin: 0 175px 0 18px
}

.spot_box .thumb_img {
    display: block;
    height: 100%;
    background: no-repeat 50% 50%;
    -webkit-background-size: cover;
    background-size: cover
}

.spot_box .link {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0
}

.spot_box .icon_play {
    overflow: hidden;
    background-image: url(../img/sp_m_9ef64f.png);
    width: 55px;
    height: 55px;
    background-position: -164px -155px;
    margin-top: -27.5px;
    margin-left: -27.5px;
    -webkit-background-size: 722px 718px;
    background-size: 722px 718px;
    position: absolute;
    left: 50%;
    top: 50%;
    z-index: 20
}

.spot_box .is_hide {
    display: none
}
/* 모바일  */
 @media screen and (min-width: 960px) {
	.spot_box .spot_info {display: none}			
			}
			
.spot_box .spot_info {
    position: absolute;
    right: 18px;
    top: 101px;
    z-index: 2;
    width: 157px;
    height: 262px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 0 20px;
    font-weight: 700;
    color: #fff;
    letter-spacing: -.3px
}

.spot_box .spot_mask {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0
}

.spot_box .spot_description,.spot_box .spot_item,.spot_box .spot_title {
    position: relative;
    z-index: 2
}

.spot_box .official_mark {
    position: relative;
    margin: 33px 0 5px;
    color: #fff
}

.spot_box .official_mark .nicon_officialblog2 {
    color: #fff;
    font-weight: 400;
    font-size: 20px;
    vertical-align: middle
}

.spot_box .official_mark>em {
    letter-spacing: -.5px;
    font-size: 13px;
    font-weight: 600;
    vertical-align: middle
}

.spot_box .official_mark+.spot_section {
    margin-top: 0
}

.spot_box .official_mark~.spot_section+.spot_item {
    bottom: 35px
}

.spot_box .spot_section {
    overflow: hidden;
    max-height: 120px;
    margin-top: 42px
}

.spot_box .spot_title {
    overflow: hidden;
    max-height: 75px;
    margin-bottom: 8px;
    font-size: 21px;
    line-height: 25px
}

.spot_box .spot_description {
    overflow: hidden;
    max-height: 55px;
    font-size: 14px;
    font-weight: 400;
    line-height: 18px;
    opacity: .6
}

.spot_box .spot_item {
    position: absolute;
    bottom: 20px;
    left: 20px
}

/* spot_info end*/

/* spot2 start */
 

@media screen and (min-width: 768px) {

	
.spot_area2 {    display: grid ;   /*가운데정렬실 grid  , 좌정렬시   */
    position: relative;
    z-index: 10;
    padding-top: 39px;
    vertical-align: middle;
    letter-spacing: -.8px;
	 
	}
.spot_section2 .thumb_img {
    overflow: hidden;
    width: 90px;
    height: 90px;
    /* margin: 0 auto; */
    -webkit-border-radius: 50px;
    border-radius: 50px;
    display: inline-block;
    float: left;}
.spot_section2 .text_area {
	    margin-top: 6px;
    font-size: 20px;
    font-weight: 300;
    line-height: 38px;
    color: #fff;
    letter-spacing: -.8px;
    word-wrap: break-word;
    word-break: break-all;
	display:inline-block;
}



}
.spot_section2 {
    position: absolute;
    z-index: 2;
    left: 0;
    right: 0;
    top: 80px;
    /*bottom: 0;*/
	max-width:1200px;
	margin:0 auto;
}

.spot_section2 .link {
    position: absolute;
    right: 5px;
    top: 65px;
    z-index: 3;
    width: 50px;
    height: 50px
}
		
.spot_section2 .spot_area {
    margin-bottom: 9px
}
.spot_section2 .thumb_img {
    overflow: hidden;
    width: 90px;
    height: 90px;
    margin: 0 auto 13px;
    -webkit-border-radius: 50px;
    border-radius: 50px;
}
.spot_section2 .thumb_img img {
    -webkit-border-radius: 50px;
    border-radius: 50px
}

.spot_section2 .text_area {
    padding: 0 50px;
}


/*좌측정렬시, 가운데정렬시 */
.spot_section2 .text_area h3 {text-align: center;}
 @media screen and (min-width: 768px) {.spot_section2 .text_area h3 {text-align:center;} }

.spot_section2 .text_area h3 span{
 color: #fff;
}

.spot_sections2 .spot_title {
    overflow: hidden;
    max-height: 50px;
    font-size: 22px;
    font-family: helveticaneue,applesdgothicneo-medium,sans-serif;
    font-weight: 400;
    letter-spacing: -.3px;
    line-height: 25px
}

.spot_section2 .spot_text {
    overflow: hidden;
    max-height: 57px;
    margin-top: 4px;
    font-size: 15px;
    color: rgba(255,255,255,.6);
    letter-spacing: -.3px;
    line-height: 19px;
	padding-top: 4px;
	text-align: center;
}

 @media screen and (min-width: 768px) {
	
	 /*.btn_wrap2 {display:none;}*/
 }
.btn_wrap2 {
    width: 100%;
    margin-top: 33px;
    text-align: center
}

.btn_wrap2 .btn_list2 {
    display: inline-block
}

.btn_wrap2 .btn_list2:after {
    display: block;
    clear: both;
    content: ""
}

.btn_list2>li {
    float: left;
    vertical-align: top;
	width:auto;
}

.btn_list2 .btn {
    display: block;
    overflow: hidden;
    width: 60px;
    height: 66px;
    word-break: break-all;
	line-height:22px;
}

.btn_list2 .in {
    display: block;
    position: relative;
    padding-top: 49px;
    font-size: 13px;
    color: rgba(255,255,255,.7);
    letter-spacing: -.5px
}

.btn_list2 .ic {
    overflow: hidden;
 
    width: 44px;
    height: 44px;

    position: absolute;
    left: 50%;
    top: 0;
    margin-left: -22px;
    -webkit-border-radius: 50%;
    border-radius: 50%
}

.btn_list2 .ic:after {
    position: absolute;
    left: 11px;
    top: 11px;
    width: 24px;
    font-size: 20px;
    color: #fff
}


/* spot2 end */