/* All */ .textAlign-center{text-align:center;} .container{width: 990px; flex-direction:column; display: flex; transition:0.3s all;} body{width: 100%; background: url('../images/bg.jpg') top/cover no-repeat; padding: 0; margin: 0;} #wrap{width: 100%;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none; user-select:none} /* 1. 전체 요소의 box-sizing 설정 */ * { box-sizing: border-box; } /* 2. body와 html의 overflow를 막음 */ html, body { width: 100%; max-width: 100%; overscroll-behavior: none; /* 모든 방향 오버스크롤 제거 */ overflow-x: hidden; overflow-y: auto; word-break: keep-all; } /* 3. 이미지, 비디오 등 콘텐츠가 넘치지 않게 */ img, video { max-width: 100%; height: auto; display: block; } .mo-br {display: none;} /* All end */ /* Header */ header{display:flex; flex-direction:column; width:990px; margin: 0 auto; box-sizing: border-box;} .header-wrapper{display:flex; align-items:center; justify-content:center; width:100%; height:100px; box-sizing:border-box; } .gnb-wrapper{display:flex; align-items:center; width:100%;} .gnb-wrapper .logo {width: 40%} .gnb-wrapper .logo a img {width: 60%} .gnb-container{display:flex; justify-content:flex-end; gap:20px; width:calc(100% - 0px);} .gnb-item{font-size:1.6rem; color:var(--color-white); cursor:pointer;} .gnb-item a{color:#fff; opacity: 0.6; transition: 0.4s all;} .gnb-item a:hover{opacity:1} .gnb-cta{width:164px;} .gnb-cta a{display:block; width:100%; padding:2px 0 3px; font-size:1.6rem; color:var(--color-white); text-align:center; border-radius:100px; background-color:#fe5000;} .gnb-cta a:hover{color:var(--color-black); background-color:var(--color-white); transition:all .2s ease;} .gnb-toggle { display: none; font-size: 2.4rem; background: none; border: none; color: #fff; cursor: pointer; } .gnb-item.has-submenu { position: relative;} .submenu {display: none;position: absolute;top: 100%; left: 0;min-width: 125px;background-color: rgba(0, 0, 0, 0.4);z-index: 999;padding: 0;margin: 0;box-shadow: 0 4px 8px rgba(0,0,0,0.3); } .gnb-item.has-submenu:hover .submenu {display: block} .submenu li { width: 100%;} .submenu li a {display: block;text-decoration: none;text-align: center;padding: 10px 15px;color: #fff;font-size: 1.4rem;white-space: nowrap} .submenu li a:hover {background: rgba(255, 255, 255, 0.2);} /* hero */ .hero-wrapper{display:flex; height: auto; align-items:center; justify-content:center; width:100%;background: url('../images/header_bg.jpg') center/cover no-repeat; border-radius: 15px; position: relative;} .hero-container{display:flex; flex-wrap:nowrap; flex-direction:column; width:100%; position: relative; padding: 50px 0 80px 0; box-sizing: border-box} .hero-container .hero-title {width: 100%; height:270px; background: url('../images/title.png') center/cover no-repeat; background-size: 70%; text-align: center; } .hero-container .hero-date {width:100%; text-align: center; padding-top: 40px;} .hero-container .hero-date span {display: inline-block; font-size: 1.8rem; padding-left: 26px; margin: 0 auto 12px auto; text-align: left; color:#fff;} .hero-container .hero-date span:nth-child(1) {width: auto; /* 텍스트 내용에 따라 너비 자동 조정 */ background: url('../images/date_icon.png') no-repeat left center; /* 아이콘 설정 */ background-size: 1.9rem; /* 아이콘 크기 */} .hero-container .hero-date span:last-child {width: auto; /* 텍스트 내용에 따라 너비 자동 조정 */ background: url('../images/place_icon.png') no-repeat left center; background-size: 1.9rem; /* 아이콘 크기 */ } .hero-container .btn {width: calc(25% - 10px); display: block;margin: 40px auto;box-sizing: border-box; background-image: linear-gradient(90deg, #00eac1, #0069ea); border-radius: 30px; text-align: center;} .hero-container .btn a{width: calc(100% - 10px); padding: 30px 10px; display: block; margin: 0px auto; box-sizing: border-box; background:url('../images/register_icon.png') no-repeat center; text-align: center; background-size: 8.5rem;} .hero-container .session-btn {width: calc(25% - 10px); display: block;margin: 40px auto;box-sizing: border-box; background-image: linear-gradient(90deg, #00eac1, #0069ea); border-radius: 35px; text-align: center;} .hero-container .session-btn a{width: calc(100% - 10px); padding: 20px 10px; display: block; margin: 0px auto; box-sizing: border-box; color:#fff; font-weight: normal; font-size: 1.7rem; text-align: center;} .hero-sponsor {width: 100%; display: flex; justify-content: center; align-items: center; height: 74px; box-sizing: border-box; position: absolute; bottom: 0; left: 0;} .hero-sponsor li.sponsor-pc{width: 100%;height: 74px; background: url('../images/sponsor.png') center/cover no-repeat rgba(0,0,0,0.2); background-size: 74%; display: block;} .hero-sponsor li.sponsor-mo{width: 100%;height: 74px; background: url('../images/sponsor_mo.png') center/cover no-repeat rgba(0,0,0,0.2); background-size: 74%; display: none;} /* Header end */ /* Main*/ main {width: 990px; margin:50px auto; display: flex; flex-direction:column; background: #0b081d; box-sizing: border-box; border-radius: 15px;} section {width:100%; box-sizing: border-box; display: flex; flex-direction: column; } /* Main end*/ /*sub title*/ section .container div .contents-title {width: 100%; display: block; } section .container div .contents-title h3 {width: 100%; display:flex; align-items: center; font-size: 2.2rem; font-weight: 400; color: #00eac1; padding-left: 30px; margin-bottom: 20px;} section .container div.ticket-event .contents-title p {display:inline-block; align-items: center; font-size: 1.6rem; font-weight: 400; color: #000; margin-bottom: 20px; background: #00eac1; padding: 7px 15px; border-radius: 30px;} section#agenda .container div .contents-title h3 {background: url('../images/subtitle_icon_07.png') no-repeat left center; background-size: 2.3rem;} section#session-reply .container div .contents-title h3 {background: url('../images/subtitle_icon_09.png') no-repeat left center; background-size: 2.3rem;} section#speaker .container div .contents-title h3 {background: url('../images/subtitle_icon_08.png') no-repeat left center; background-size: 2.2rem;} section#sponsor .container div .contents-title h3 {background: url('../images/subtitle_icon_05.png') no-repeat left center; background-size: 2.3rem;} section .container div.ticket-info-list .contents-title h3 {background: url('../images/subtitle_icon_01.png') no-repeat left center; background-size: 2.3rem;} section .container div.ticket-info-notice .contents-title h3 {background: url('../images/subtitle_icon_02.png') no-repeat left center; background-size: 2.1rem;} section .container div.ticket-info-contact .contents-title h3 {background: url('../images/subtitle_icon_03.png') no-repeat left center; background-size: 2.1rem;} section#contact .container div .contents-title h3 {background: url('../images/subtitle_icon_03.png') no-repeat left center; background-size: 2.1rem;} section .container div.ticket-info-place .contents-title h3 {background: url('../images/subtitle_icon_04.png') no-repeat left center; background-size: 2.1rem;} section .container div.ticket-event .contents-title h3 {background: url('../images/subtitle_icon_06.png') no-repeat left center; background-size: 2.1rem;} /*sub title end*/ /* Intro */ #intro .container .intro-wrapper{width: 100%; display: flex; flex-direction: column; box-sizing: border-box; padding: 50px;} #intro .container .intro-wrapper h2{width:100%; font-size: 2.8rem; font-weight: 400; padding-bottom: 20px; color:#Fff;} #intro .container .intro-wrapper h2 strong {font-weight: 400; color:#00eac1} #intro .container .intro-wrapper p {width:100%; font-size: 1.6rem; font-weight: normal; line-height: 1.6; padding: 8px 0; color: #fff;} #intro .container .intro-wrapper .pc-br {display: block;} /* Intro end */ /*event-place*/ #event-place {background: url('../images/date_banner_bg.jpg') center/cover no-repeat; padding: 30px;} #event-place .container .date-info { width: 100%; text-align: center; font-size: 1.6rem;} #event-place .container .date-info li {background-size: contain; color: #fff;} #event-place .container .date-info li:nth-child(1) {width: 30%; display: block; background: url('../images/date_icon.png') no-repeat left center; background-size: 1.9rem; margin: 0 auto; margin-bottom: 12px;} #event-place .container .date-info li:nth-child(2) {width: 39%; display: block; background: url('../images/place_icon.png') no-repeat left center; background-size: 1.9rem; margin: 0 auto;} /*event-place end*/ /*agenda*/ #agenda {width: 100%; padding: 50px 60px; box-sizing: border-box; border-bottom: 1px solid rgba(255,255,255,0.2);} #agenda .container {width: 100%; box-sizing: border-box;} #agenda .container div {width: 100%; box-sizing: border-box;} #agenda .container div div {width: 100%; box-sizing: border-box;} #agenda .container div div.agenda-img {width: 100%; background: url('../images/agenda.png') no-repeat center/cover; padding-top:100%; background-size: 100%;} #agenda .container div div.agenda-content table{width: 100%; font-size: 1.6rem; color:#fff; border-collapse: collapse;} #agenda .container div div.agenda-content table thead{width: 100%; background: #00eac1; } #agenda .container div div.agenda-content table thead tr{width: 100%; } #agenda .container div div.agenda-content table thead tr th{color:#000; text-align: center; padding: 1%;} #agenda .container div div.agenda-content table thead tr th:nth-child(1){width: 19%} #agenda .container div div.agenda-content table thead tr th:nth-child(2){width: 81%; text-align: center;} #agenda .container div div.agenda-content table tbody{width: 100%;} #agenda .container div div.agenda-content table tbody tr{width: 100%;} #agenda .container div div.agenda-content table tbody tr td{width: 100%; text-align: center;padding: 2%; border-bottom: 1px solid rgba(255,255,255,0.2); align-content: center} #agenda .container div div.agenda-content table tbody tr td p{font-weight: bold; font-size: 1.6rem; padding-bottom: 4px;} #agenda .container div div.agenda-content table tbody tr td p b{font-weight: bold; font-size: 1.3rem; color:rgba(255,255,255,0.7)} #agenda .container div div.agenda-content table tbody tr td p.agenda-speaker{font-weight: normal; font-size: 1.3rem; color:rgba(255,255,255,0.7)} #agenda .container div div.agenda-content table tbody tr td p.agenda-speaker span{font-weight: normal; font-size: 1.3rem; color:#00eac1} #agenda .container div div.agenda-content table tbody.track-detail tr td.track-session{align-content: flex-start} /**#agenda .container div div.agenda-content table tbody tr td.braze{background: url('../images/braze.png') no-repeat center; background-size: 12%;} #agenda .container div div.agenda-content table tbody tr td.amplitude{background: url('../images/amplitude.png') no-repeat center; background-size: 12%;} #agenda .container div div.agenda-content table tbody tr td.shopify{background: url('../images/shopify.png') no-repeat center; background-size: 12%;} #agenda .container div div.agenda-content table tbody tr td.shopify{background: url('../images/shopify.png') no-repeat center; background-size: 12%;} #agenda .container div div.agenda-content table tbody tr td.martinee{background: url('../images/martinee.png') no-repeat center; background-size: 12%;} #agenda .container div div.agenda-content table tbody.track-detail tr td.snowflake{background: url('../images/snowflake.png') no-repeat center; background-size: 50%;} #agenda .container div div.agenda-content table tbody.track-detail tr td.wrtn{background: url('../images/wrtn.png') no-repeat center; background-size: 25%;} #agenda .container div div.agenda-content table tbody.track-detail tr td.olivebraze{background: url('../images/olivebraze.png') no-repeat center; background-size: 62%;} #agenda .container div div.agenda-content table tbody.track-detail tr td.amplitude{background: url('../images/amplitude.png') no-repeat center; background-size: 40%;} #agenda .container div div.agenda-content table tbody.track-detail tr td.aws{background: url('../images/aws.png') no-repeat center; background-size: 33%;} #agenda .container div div.agenda-content table tbody.track-detail tr td.alarmy{background: url('../images/alarmy.png') no-repeat center; background-size: 33%;} #agenda .container div div.agenda-content table tbody.track-detail tr td.dxe{background: url('../images/dxe.png') no-repeat center; background-size: 33%;} #agenda .container div div.agenda-content table tbody.track-detail tr td.goodwearmall{background: url('../images/goodwearmall.png') no-repeat center; background-size: 45%;} #agenda .container div div.agenda-content table tbody.track-detail tr td.salesforce{background: url('../images/salesforce.png') no-repeat center; background-size: 33%;} #agenda .container div div.agenda-content table tbody.track-detail tr td.cornerstone{background: url('../images/cornerstone.png') no-repeat center; background-size: 45%;} #agenda .container div div.agenda-content table tbody.track-detail tr td.cocone{background: url('../images/cocone.png') no-repeat center; background-size: 36%;} #agenda .container div div.agenda-content table tbody.track-detail tr td.tving{background: url('../images/tving.png') no-repeat center; background-size: 33%;} #agenda .container div div.agenda-content table tbody.track-detail tr td.oliveyoung{background: url('../images/oliveyoung.png') no-repeat center; background-size: 33%;} #agenda .container div div.agenda-content table tbody.track-detail tr td.ascent{background: url('../images/ascent.png') no-repeat center; background-size: 45%;} #agenda .container div div.agenda-content table tbody.track-detail tr td.bodac{background: url('../images/bodac.png') no-repeat center; background-size: 33%;} #agenda .container div div.agenda-content table tbody.track-detail tr td.hana{background: url('../images/hana.png') no-repeat center; background-size: 33%;} #agenda .container div div.agenda-content table tbody.track-detail tr td.cjolive{background: url('../images/cjolive.png') no-repeat center; background-size: 45%;} #agenda .container div div.agenda-content table tbody.track-detail tr td.miso{background: url('../images/miso.png') no-repeat center; background-size: 33%;} #agenda .container div div.agenda-content table tbody.track-detail tr td.pannel{background: url('../images/pannel_sponsor.png') no-repeat center; background-size: 58%; }**/ #agenda .container div div.agenda-content table tbody tr td:nth-child(1){width: 19%;} #agenda .container div div.agenda-content table tbody tr td:nth-child(2){width: 27%; align-content: center;} #agenda .container div div.agenda-content table tbody tr td:nth-child(3){width: 27%;} #agenda .container div div.agenda-content table tbody tr td:nth-child(4){width: 27%;} #agenda .container div div.agenda-content table tbody tr.break {background: rgba(255,255,255,0.1)} #agenda .container div div.agenda-content table tbody tr.track td{background: #00eac1; border-left: 1px solid rgba(0,0,0,0.2); align-content: flex-start} #agenda .container div div.agenda-content table tbody tr.track td p, #agenda .container div div.agenda-content table tbody tr.track td b{color:#000; font-size: 1.6rem;} #agenda .container div div.agenda-content table tbody tr.track td p{margin-top: 4px; font-weight: normal;} #agenda .container div div.agenda-content table tbody tr td.keynote p.pannel-text span{font-size: 1.4rem; font-weight: normal; padding: 3px 6px; background: rgba(255,255,255,0.1); border-radius: 4px; display: inline-block;} #agenda .container div div.agenda-content table tbody tr td.pannel p.pannel-text{font-size: 1.4rem; font-weight: normal; padding: 3px 6px; background: rgba(255,255,255,0.1); border-radius: 4px; display: inline-block; margin-bottom: 10px;} #agenda .container div div.agenda-content table tbody tr.track td span{ background: #000; color:#00eac1; border-radius: 5px; padding: 2px 8px; font-size: 1.4rem;} #agenda .container div div.agenda-notice p {font-size: 1.2rem; opacity: 0.5; padding-top: 10px; color: #fff;} /*modal*/ .modal {display: none; position: fixed; z-index: 1000; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.7);} .modal .modal-content { position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); /* 화면 가운데 정렬 */ background-color: #fff; padding: 30px; width: 90%; max-width: 500px; border-radius: 8px; box-shadow: 0 4px 20px rgba(0,0,0,0.2);} #modal-braze .modal-content .modal-title { background: url('../images/sponsor_01.png') no-repeat left; width: 100%; padding-top: 70px; background-size: 20%;} #modal-amplitude .modal-content .modal-title { background: url('../images/sponsor_02.png') no-repeat left; width: 100%; padding-top: 70px; background-size: 30%;} #modal-shopify .modal-content .modal-title { background: url('../images/sponsor_22.png') no-repeat left; width: 100%; padding-top: 70px; background-size: 30%;} #modal-shopify2 .modal-content .modal-title { background: url('../images/sponsor_22.png') no-repeat left; width: 100%; padding-top: 70px; background-size: 30%;} #modal-martinee .modal-content .modal-title { background: url('../images/sponsor_09.png') no-repeat left; width: 100%; padding-top: 70px; background-size: 30%;} #modal-snowflake .modal-content .modal-title { background: url('../images/sponsor_04.png') no-repeat left; width: 100%; padding-top: 70px; background-size: 30%;} #modal-amplitude2 .modal-content .modal-title { background: url('../images/sponsor_02.png') no-repeat left; width: 100%; padding-top: 70px; background-size: 30%;} #modal-dxe .modal-content .modal-title { background: url('../images/sponsor_07.png') no-repeat left; width: 100%; padding-top: 70px; background-size: 25%;} #modal-cornerstone .modal-content .modal-title { background: url('../images/sponsor_08.png') no-repeat left; width: 100%; padding-top: 70px; background-size: 34%;} #modal-oliveyoung .modal-content .modal-title { background: url('../images/sponsor_13.png') no-repeat left; width: 100%; padding-top: 70px; background-size: 30%;} #modal-hana .modal-content .modal-title { background: url('../images/sponsor_17.png') no-repeat left; width: 100%; padding-top: 70px; background-size: 30%;} #modal-cjolive .modal-content .modal-title { background: url('../images/sponsor_28.png') no-repeat left; width: 100%; padding-top: 70px; background-size: 40%;} #modal-wrtn .modal-content .modal-title { background: url('../images/sponsor_21.png') no-repeat left; width: 100%; padding-top: 70px; background-size: 26%;} #modal-aws .modal-content .modal-title { background: url('../images/aws_b.png') no-repeat left; width: 100%; padding-top: 70px; background-size: 16%;} #modal-cocone .modal-content .modal-title { background: url('../images/sponsor_20.png') no-repeat left; width: 100%; padding-top: 70px; background-size: 30%;} #modal-goodwearmall .modal-content .modal-title { background: url('../images/sponsor_15.png') no-repeat left; width: 100%; padding-top: 70px; background-size: 34%;} #modal-ascent .modal-content .modal-title { background: url('../images/sponsor_23.png') no-repeat left; width: 100%; padding-top: 70px; background-size: 30%;} #modal-olivebraze .modal-content .modal-title { background: url('../images/sponsor_25.png') no-repeat left; width: 100%; padding-top: 70px; background-size: 40%;} #modal-alarmy .modal-content .modal-title { background: url('../images/sponsor_16.png') no-repeat left; width: 100%; padding-top: 70px; background-size: 30%;} #modal-salesforce .modal-content .modal-title { background: url('../images/salesforce_b.png') no-repeat left; width: 100%; padding-top: 70px; background-size: 20%;} #modal-tving .modal-content .modal-title { background: url('../images/sponsor_14.png') no-repeat left; width: 100%; padding-top: 70px; background-size: 24%;} #modal-bodac .modal-content .modal-title { background: url('../images/bodac_b.png') no-repeat left; width: 100%; padding-top: 70px; background-size: 14%;} #modal-miso .modal-content .modal-title { background: url('../images/miso_b.png') no-repeat left; width: 100%; padding-top: 70px; background-size: 20%;} #modal-pannel .modal-content .modal-title { background: url('../images/sponsor_29.png') no-repeat left; width: 100%; padding-top: 70px; background-size: 85%;} .modal .modal-content p{ color:#000; font-size: 1.6rem; padding-top: 15px;} .modal .modal-content span{ color:#000; font-size: 1.6rem;} .modal .close {position: absolute; top: 10px; right: 15px; font-size: 20px; cursor: pointer; color: #aaa; transition: 0.3s all} .modal .close:hover {color: #00eac1;} .modal-trigger {color:#fff; transition: 0.3s all;} .modal-trigger:hover {color: #00eac1} /*agenda end*/ /*speaker*/ #speaker {width: 100%; padding: 50px; box-sizing: border-box; border-bottom: 1px solid rgba(255,255,255,0.2);} #speaker .container {width: 100%; box-sizing: border-box;} #speaker .container .speaker-list {width: 100%; box-sizing: border-box;} #speaker .container .speaker-list div {width: 100%; box-sizing: border-box;} #speaker .container .speaker-list ul {width: 100%; box-sizing: border-box; display: block;} #speaker .container .speaker-list ul:after {clear: both; content:"";display: block;} #speaker .container .speaker-list ul li {width: calc(25% - 15px); float: left; box-sizing: border-box; display: block; margin-right: 20px; height: 250px; margin-bottom: 20px;position: relative; border-radius: 10px;} #speaker .container .speaker-list ul li:nth-child(4n) {margin-right: 0px;} #speaker .container .speaker-list ul li.speaker-01 {background: url('../images/speaker_01.png') no-repeat center top / cover; } #speaker .container .speaker-list ul li.speaker-02 {background: url('../images/speaker_02.png') no-repeat center top / cover; } #speaker .container .speaker-list ul li .text-box {position: absolute; bottom: 0; left: 0;} #speaker .container .speaker-list ul li.speaker-03 {background: url('../images/speaker_03.png') no-repeat center top / cover; } #speaker .container .speaker-list ul li.speaker-04 {background: url('../images/speaker_04.png') no-repeat center top / cover; } #speaker .container .speaker-list ul li.speaker-05 {background: url('../images/speaker_05.png') no-repeat center top / cover; } #speaker .container .speaker-list ul li.speaker-06 {background: url('../images/speaker_06.png') no-repeat center top / cover; } #speaker .container .speaker-list ul li.speaker-07 {background: url('../images/speaker_07.png') no-repeat center top / cover; } #speaker .container .speaker-list ul li.speaker-08 {background: url('../images/speaker_08.png') no-repeat center top / cover; } #speaker .container .speaker-list ul li.speaker-09 {background: url('../images/speaker_09.png') no-repeat center top / cover; } #speaker .container .speaker-list ul li.speaker-10 {background: url('../images/speaker_10.png') no-repeat center top / cover; } #speaker .container .speaker-list ul li.speaker-11 {background: url('../images/speaker_11.png') no-repeat center top / cover; } #speaker .container .speaker-list ul li.speaker-12 {background: url('../images/speaker_12.png') no-repeat center top / cover; } #speaker .container .speaker-list ul li.speaker-13 {background: url('../images/speaker_13.png') no-repeat center top / cover; } #speaker .container .speaker-list ul li.speaker-14 {background: url('../images/speaker_14.png') no-repeat center top / cover; } #speaker .container .speaker-list ul li.speaker-15 {background: url('../images/speaker_15.png') no-repeat center top / cover; } #speaker .container .speaker-list ul li.speaker-16 {background: url('../images/speaker_16.png') no-repeat center top / cover; } #speaker .container .speaker-list ul li.speaker-17 {background: url('../images/speaker_17.png') no-repeat center top / cover; } #speaker .container .speaker-list ul li.speaker-18 {background: url('../images/speaker_18.png') no-repeat center top / cover; } #speaker .container .speaker-list ul li.speaker-19 {background: url('../images/speaker_19.png') no-repeat center top / cover; } #speaker .container .speaker-list ul li.speaker-20 {background: url('../images/speaker_20.png') no-repeat center top / cover; } #speaker .container .speaker-list ul li.speaker-21 {background: url('../images/speaker_21.png') no-repeat center top / cover; } #speaker .container .speaker-list ul li.speaker-22 {background: url('../images/speaker_22.png') no-repeat center top / cover; } #speaker .container .speaker-list ul li.speaker-23 {background: url('../images/speaker_23.png') no-repeat center top / cover; } #speaker .container .speaker-list ul li.speaker-24 {background: url('../images/speaker_24.png') no-repeat center top / cover; } #speaker .container .speaker-list ul li.speaker-25 {background: url('../images/speaker_25.png') no-repeat center top / cover; } #speaker .container .speaker-list ul li.speaker-26 {background: url('../images/speaker_26.png') no-repeat center top / cover; } #speaker .container .speaker-list ul li.speaker-27 {background: url('../images/speaker_27.png') no-repeat center top / cover; } #speaker .container .speaker-list ul li.speaker-28 {background: url('../images/speaker_28.png') no-repeat center top / cover; } #speaker .container .speaker-list ul li.speaker-29 {background: url('../images/speaker_29.png') no-repeat center top / cover; } #speaker .container .speaker-list ul li.speaker-30 {background: url('../images/speaker_30.png') no-repeat center top / cover; } #speaker .container .speaker-list ul li.speaker-31 {background: url('../images/speaker_31.png') no-repeat center top / cover; } #speaker .container .speaker-list ul li.speaker-32 {background: url('../images/speaker_32.png') no-repeat center top / cover; } #speaker .container .speaker-list ul li.speaker-33 {background: url('../images/speaker_33.png') no-repeat center top / cover; } #speaker .container .speaker-list ul li div {width: 100%; box-sizing: border-box; padding: 6%; } #speaker .container .speaker-list ul li div h5 {font-size: 1.6rem; color:#fff; padding-bottom:5px;} #speaker .container .speaker-list ul li div span {font-size: 1.3rem; color:#fff; opacity: 0.5; padding-bottom:5px;} #speaker .container .speaker-list ul li div p {font-size: 1.3rem; color:#00eac1;} /*speaker end*/ /*sponsor*/ #sponsor {width: 100%; padding: 50px; box-sizing: border-box;} #sponsor .container {width: 100%; box-sizing: border-box;} #sponsor .container .sponsor-list {width: 100%; box-sizing: border-box;} #sponsor .container .sponsor-list div {width: 100%; box-sizing: border-box;} #sponsor .container .sponsor-list div:last-child {padding-bottom: 0;} #sponsor .container .sponsor-list div h4 {font-size:2.0rem; font-weight: normal; display: block;} #sponsor .container .sponsor-list div.sponsor-list-01 h4 {background: url('../images/sponsor_medal_01.png') no-repeat left center; color: #00eac1; font-weight: bold; padding-left: 25px; background-size:2rem;} #sponsor .container .sponsor-list div.sponsor-list-02 h4 {background: url('../images/sponsor_medal_02.png') no-repeat left center; color: #cbdae8; font-weight: bold; padding-left: 25px; background-size:2rem;} #sponsor .container .sponsor-list div.sponsor-list-03 h4 {background: url('../images/sponsor_medal_03.png') no-repeat left center; color: #e4c372; font-weight: bold; padding-left: 25px; background-size:2rem;} #sponsor .container .sponsor-list div.sponsor-list-04 h4 {background: url('../images/sponsor_medal_04.png') no-repeat left center; color: #aeaeae; font-weight: bold; padding-left: 25px; background-size:2rem;} #sponsor .container .sponsor-list div ul{width: 100%; box-sizing: border-box; display: block; padding-top: 10px;} #sponsor .container .sponsor-list div ul:after{content: ""; display: block; clear: both;} #sponsor .container .sponsor-list div ul li{width: calc(25% - 15px); float: left; box-sizing: border-box;height: 70px;border: 1px solid rgba(255,255,255,0.1);border-radius: 10px;padding: 10px 30px;margin-right: 20px; margin-bottom: 40px;} #sponsor .container .sponsor-list div ul li:nth-child(4n) {margin-right: 0;} #sponsor .container .sponsor-list div.sponsor-list-01 ul li:nth-child(1) {background: url('../images/sponsor_01.png') no-repeat center/cover #fff; background-size: 40%; } #sponsor .container .sponsor-list div.sponsor-list-01 ul li:nth-child(2) {background: url('../images/sponsor_02.png') no-repeat center/cover #fff; background-size: 70%; } #sponsor .container .sponsor-list div.sponsor-list-02 ul li:nth-child(1) {background: url('../images/sponsor_22.png') no-repeat center/cover #fff; background-size: 55%;} #sponsor .container .sponsor-list div.sponsor-list-02 ul li:nth-child(2) {background: url('../images/sponsor_04.png') no-repeat center/cover #fff; background-size: 70%;} #sponsor .container .sponsor-list div.sponsor-list-02 ul li:nth-child(3) {background: url('../images/sponsor_05.png') no-repeat center/cover #fff; background-size: 50%;} #sponsor .container .sponsor-list div.sponsor-list-03 ul li:nth-child(1) {background: url('../images/sponsor_06.png') no-repeat center/cover #fff; background-size: 50%; margin-bottom: 20px} #sponsor .container .sponsor-list div.sponsor-list-03 ul li:nth-child(2) {background: url('../images/sponsor_07.png') no-repeat center/cover #fff; background-size: 50%; margin-bottom: 20px} #sponsor .container .sponsor-list div.sponsor-list-03 ul li:nth-child(3) {background: url('../images/sponsor_08.png') no-repeat center/cover #fff; background-size: 70%; margin-bottom: 20px} #sponsor .container .sponsor-list div.sponsor-list-03 ul li:nth-child(4) {background: url('../images/sponsor_09.png') no-repeat center/cover #fff; background-size: 50%; margin-bottom: 20px} #sponsor .container .sponsor-list div.sponsor-list-03 ul li:nth-child(5) {background: url('../images/sponsor_10.png') no-repeat center/cover #fff; background-size: 60%;} #sponsor .container .sponsor-list div.sponsor-list-03 ul li:nth-child(6) {background: url('../images/sponsor_24.png') no-repeat center/cover #fff; background-size: 60%;} #sponsor .container .sponsor-list div.sponsor-list-03 ul li:nth-child(7) {background: url('../images/sponsor_23.png') no-repeat center/cover #fff; background-size: 72%;} #sponsor .container .sponsor-list div.sponsor-list-04 ul li:nth-child(1) {background: url('../images/sponsor_12.png') no-repeat center/cover #fff; background-size: 50%; margin-bottom: 20px} #sponsor .container .sponsor-list div.sponsor-list-04 ul li:nth-child(2) {background: url('../images/sponsor_13.png') no-repeat center/cover #fff; background-size: 70%; margin-bottom: 20px} #sponsor .container .sponsor-list div.sponsor-list-04 ul li:nth-child(3) {background: url('../images/sponsor_21.png') no-repeat center/cover #fff; background-size: 45%; margin-bottom: 20px} #sponsor .container .sponsor-list div.sponsor-list-04 ul li:nth-child(4) {background: url('../images/sponsor_14.png') no-repeat center/cover #fff; background-size: 50%; margin-bottom: 20px} #sponsor .container .sponsor-list div.sponsor-list-04 ul li:nth-child(5) {background: url('../images/sponsor_16.png') no-repeat center/cover #fff; background-size: 55%; margin-bottom: 20px} #sponsor .container .sponsor-list div.sponsor-list-04 ul li:nth-child(6) {background: url('../images/sponsor_15.png') no-repeat center/cover #fff; background-size: 75%; margin-bottom: 20px} #sponsor .container .sponsor-list div.sponsor-list-04 ul li:nth-child(7) {background: url('../images/sponsor_17.png') no-repeat center/cover #fff; background-size: 50%; margin-bottom: 20px} #sponsor .container .sponsor-list div.sponsor-list-04 ul li:nth-child(8) {background: url('../images/sponsor_18.png') no-repeat center/cover #fff; background-size: 50%; margin-bottom: 20px} #sponsor .container .sponsor-list div.sponsor-list-04 ul li:nth-child(9) {background: url('../images/sponsor_19.png') no-repeat center/cover #fff; background-size: 45%;} #sponsor .container .sponsor-list div.sponsor-list-04 ul li:nth-child(10) {background: url('../images/sponsor_20.png') no-repeat center/cover #fff; background-size: 50%; margin-bottom: 0} #sponsor .container .sponsor-list div.sponsor-list-04 ul li:nth-child(11) {background: url('../images/sponsor_26.png') no-repeat center/cover #fff; background-size: 50%; margin-bottom: 0} #sponsor .container .sponsor-list div.sponsor-list-04 ul li:nth-child(12) {background: url('../images/tada_b.png') no-repeat center/cover #fff; background-size: 34%; margin-bottom: 0} /*sponsor end*/ /* ticket-info */ /* ticket-info end */ /*ticket-info-list*/ .ticket-info-list { border-bottom: 1px solid rgba(255,255,255,0.2); padding:50px 60px; box-sizing: border-box;} .ticket-info-list .register-btn{width: 100%; overflow: hidden;} .ticket-info-list .register-btn::after{clear: both; display: block; content: ""} .ticket-info-list .register-btn a {font-size: 1.6rem; font-weight: 400;} .ticket-info-list .register-btn div{ width: calc(50% - 10px); float: left; margin-right: 10px; padding: 10px; border-radius: 15px; box-sizing: border-box;} .ticket-info-list .register-btn div div{width: 100%; padding: 30px 50px; display: block; border-radius: 8px; box-sizing: border-box; text-align: center; margin-bottom: 15px;} .ticket-info-list .register-btn div p{width: 100%; padding: 10px 50px; display: block; font-size: 2.6rem; text-align:center; font-weight: bold; box-sizing: border-box; position: relative; line-height: 1.2;} .ticket-info-list .register-btn div p span{font-size: 1.2rem; color:#999999; font-weight: normal;display: inline-block; vertical-align: bottom; margin-left: 5px; line-height: 1; } .ticket-info-list .register-btn .register-btn-pre{border:2px solid #00eac1; margin-right:10px; } .ticket-info-list .register-btn .register-btn-pre div {color:#000; background: url('../images/btn_icon_b.png') center no-repeat #00eac1; background-size:24%; transition: all 0.3s } .ticket-info-list .register-btn .register-btn-pre p {color:#00eac1;} .ticket-info-list .register-btn .register-btn-onsite{border:2px solid #0069ea; margin-left: 10px; margin-right: 0;} .ticket-info-list .register-btn .register-btn-onsite div {color:#fff; background: url('../images/btn_icon.png') center no-repeat #0069ea; background-size:24%; transition: all 0.3s } .ticket-info-list .register-btn .register-btn-onsite p {color:#0069ea;} /*ticket-info-list end*/ /*ticket-event*/ .ticket-event {width: 100%; box-sizing: border-box; padding: 50px 60px; border-bottom: 1px solid rgba(255,255,255,0.2);} .ticket-event .ticket-event-gift {width: 100%; box-sizing: border-box;} .ticket-event .ticket-event-gift ul {width: 100%; box-sizing: border-box; display: flex; flex-direction: row;} .ticket-event .ticket-event-gift ul li {width: 33%; box-sizing: border-box; padding-top: 25%; margin: 0 10px} .ticket-event .ticket-event-gift ul li:nth-child(1) {background: url('../images/event_01.png') no-repeat center/cover; background-size:100%; margin-left: 0;} .ticket-event .ticket-event-gift ul li:nth-child(2) {background: url('../images/event_02.png') no-repeat center/cover; background-size:100%} .ticket-event .ticket-event-gift ul li:nth-child(3) {background: url('../images/event_03.png') no-repeat center/cover; background-size:100%; margin-right: 0;} .ticket-event .ticket-event-gift p {font-size: 1.3rem; color:rgba(255,255,255,0.4)} /*ticket-event end*/ /*tieckt-info-notice*/ .ticket-info-notice {width: 100%; padding: 50px 60px; box-sizing: border-box;} .ticket-info-notice .notice {width: 100%; box-sizing: border-box} .ticket-info-notice .notice p {font-size: 1.6rem; margin: 10px 0; background: url('../images/check_icon.png') no-repeat left center; background-size: 1.8rem; padding-left: 24px; color:#fff;} /*tieckt-info-notice end*/ /*ticket-info-contact*/ .ticket-info-contact {border-bottom: 1px solid rgba(255,255,255,0.2); padding:0px 60px 50px 60px; box-sizing: border-box;} .ticket-info-contact .contact-email {width:100%; display: flex; font-size: 1.6rem;} .ticket-info-contact .contact-email p {color:#fff;padding-right: 10px;} .ticket-info-contact .contact-email a { display: inline-flex; align-items: center; background: url('../images/mail_icon.png') no-repeat left center; background-size: 2rem; padding-left: 24px; line-height: 1; height: 20px; transition: all 0.3s; color:#fff;} .ticket-info-contact .contact-email a:hover {color:#00eac1; background: url('../images/mail_icon_hover.png') no-repeat left center; background-size: 2rem;} /*ticket-info-contact end*/ /*ticket-info-place*/ .ticket-info-place {padding: 50px 60px; box-sizing: border-box;} .ticket-info-place p {width: 100%; font-size: 1.6rem; padding-bottom: 20px; color:#fff;} .ticket-info-place .map {width: 100%; height: 294px;} .ticket-info-place .map a {width: 100%; height: 294px; background: url('../images/map.jpg') center/cover no-repeat; display: block; border-radius: 15px;} /*ticket-info-place end*/ /* Footer */ footer{display:flex; flex-direction:column; align-items:center;width:100%; padding: 20px 0; border-top: 1px solid rgba(255,255,255,0.1);} footer .footer-wrapper{display:block; width:100%;} footer .footer-wrapper .f-logo {width: 100%; display: block; height: 60px; background: url('../images/footer_logo.png') no-repeat left center; background-size: 16rem; } footer .footer-wrapper .f-text {width: 100%; font-size: 1.2rem; opacity: 0.4;} footer .footer-wrapper .f-text:after {content: ""; display: block; clear: both;} footer .footer-wrapper .f-text li {width: 50%; float: left; color:rgba(255,255,255,0.6)} footer .footer-wrapper .f-text li:last-child {text-align: right;} /*********다시보기 css start********/ /*session-reply*/ #session-reply {width: 100%; padding: 50px; box-sizing: border-box; border-bottom: 1px solid rgba(255,255,255,0.2); border-top: 1px solid rgba(255,255,255,0.2);} #session-reply .container {width: 100%; box-sizing: border-box;} #session-reply .container div {width: 100%; box-sizing: border-box;} #session-reply .container div div {width: 100%; box-sizing: border-box;} #session-reply .container div div.reply-content table{width: 100%; font-size: 1.6rem; color:#fff; border-collapse: collapse;} #session-reply .container div div.reply-content table thead{width: 100%; background: #00eac1; } #session-reply .container div div.reply-content table thead tr{width: 100%; } #session-reply .container div div.reply-content table thead tr th{color:#000; text-align: center; padding: 1%;} #session-reply .container div div.reply-content table thead tr th:nth-child(1){width: 19%} #session-reply .container div div.reply-content table thead tr th:nth-child(2){width: 81%; text-align: center;} #session-reply .container div div.reply-content table tbody{width: 100%;} #session-reply .container div div.reply-content table tbody tr{width: 100%;} #session-reply .container div div.reply-content table tbody tr td{width: 100%; text-align: center;padding: 2%; border-bottom: 1px solid rgba(255,255,255,0.2); align-content: center} #session-reply .container div div.reply-content table tbody tr td .reply-btn{width: calc(18% - 10px); background: linear-gradient(90deg, #00eac1, #0069ea); padding: 1%; border-radius: 30px; margin: 1% auto 0 auto;} #session-reply .container div div.reply-content table tbody tr td .reply-btn a{color:#fff; background:url('../images/video_icon.png') left no-repeat; font-size: 1.4rem; padding-left: 20px; background-size: 20%;} #session-reply .container div div.reply-content table tbody tr td p{font-weight: bold; font-size: 1.6rem; padding-bottom: 4px;} #session-reply .container div div.reply-content table tbody tr td p b{font-weight: bold; font-size: 1.3rem; color:rgba(255,255,255,0.7)} #session-reply .container div div.reply-content table tbody tr td p.agenda-speaker{font-weight: normal; font-size: 1.3rem; color:rgba(255,255,255,0.7)} #session-reply .container div div.reply-content table tbody tr td p.agenda-speaker span{font-weight: normal; font-size: 1.3rem; color:#00eac1} #session-reply .container div div.reply-content table tbody tr td p.notice{font-weight: normal; font-size: 1.1rem; color:rgba(255,255,255,0.7); padding-top: 10px;} #session-reply .container div div.reply-content table tbody.track-detail tr td.track-session{align-content: flex-start} #session-reply .container div div.reply-content table tbody.track-detail tr td.track-session .reply-btn{width: calc( 55% - 10px); background: linear-gradient(90deg, #00eac1, #0069ea); padding: 3%; border-radius: 30px; margin: 3% auto 0 auto;} #session-reply .container div div.reply-content table tbody tr td:nth-child(1){width: 33.3%;} #session-reply .container div div.reply-content table tbody tr td:nth-child(2){width: 33.3%; align-content: center;} #session-reply .container div div.reply-content table tbody tr td:nth-child(3){width: 33.3%;} #session-reply .container div div.reply-content table tbody tr.track td{background: #00eac1; border-left: 1px solid rgba(0,0,0,0.2); align-content: flex-start} #session-reply .container div div.reply-content table tbody tr.track td p, #session-reply .container div div.reply-content table tbody tr.track td b{color:#000; font-size: 1.6rem;} #session-reply .container div div.reply-content table tbody tr.track td p{margin-top: 4px; font-weight: normal;} #session-reply .container div div.reply-content table tbody tr td.pannel p .pannel-text{font-size: 1.4rem; font-weight: normal; padding: 3px 6px; background: rgba(255,255,255,0.1); border-radius: 4px;} #session-reply .container div div table tbody tr td.keynote p.pannel-text span{font-size: 1.4rem; font-weight: normal; padding: 3px 6px; background: rgba(255,255,255,0.1); border-radius: 4px; display: inline-block;} #session-reply .container div div.reply-content table tbody tr.track td span{ background: #000; color:#00eac1; border-radius: 5px; padding: 2px 8px; font-size: 1.4rem;} #session-reply .container div div.agenda-notice p {font-size: 1.2rem; opacity: 0.5; padding-top: 10px; color: #fff;} /*#contact*/ #contact {padding:50px; box-sizing: border-box; background: rgba(255,255,255,0.04); border-radius: 0 0 15px 15px } #contact .contact-email {width:100%; display: flex; font-size: 1.6rem; margin: 7px 0;} #contact .contact-email p {color:#00eac1;padding-left: 5px; border-left: 2px solid #00eac1; width: 20%; } #contact .contact-email a { width: 80%; display: inline-flex; align-items: center; background: url('../images/mail_icon.png') no-repeat left center; background-size: 2rem; padding-left: 24px; line-height: 1; height: 20px; transition: all 0.3s; color:#fff;} #contact .contact-email a:hover {color:#00eac1; background: url('../images/mail_icon_hover.png') no-repeat left center; background-size: 2rem;} /*ticket-info-contact end*/ /*********다시보기 css end********/ @media only screen and (max-width: 1920px) { } @media only screen and (max-width: 1600px) { } @media only screen and (max-width: 1280px) { } @media only screen and (max-width: 1180px) { } @media only screen and (max-width: 1024px) { } @media only screen and (max-width: 960px) { /*header*/ header {width: 100%;} .header-wrapper {width:100%; padding: 20px 4%; } .hero-wrapper {width:92%; margin: 0px auto;} .hero-container {padding: 4% 0 11% 0} .hero-container .hero-title {height:250px; background-size: 80%;} .hero-container .hero-date {padding-top: 10px;} .hero-container .btn {margin: 20px auto;} .hero-container .session-btn {margin: 20px auto;} .gnb-wrapper .logo {width: 50%;} .gnb-wrapper .logo a img {width: 60%;} .hero-container .session-btn a {padding: 14px;} .hero-container .session-btn {width: 35%;} /*main*/ main {width: 92%; margin: 40px auto;} .container {width: 100%;} /*intro*/ #intro .container .intro-wrapper {width: 100%; display: flex; flex-direction: column; box-sizing: border-box; padding: 50px 4%;} /*intro*/ #intro .container .intro-wrapper .pc-br {display: none;} /*event-place*/ #event-place .container .date-info li span {color:#fff;} #event-place .container .date-info li:nth-child(1) {width: calc(42% - 10px);color:#fff;} #event-place .container .date-info li:nth-child(2) {width: calc(53% - 10px);color:#fff;} /*agenda*/ #agenda {padding: 50px 4%;} /*agenda end*/ /*session-reply*/ #session-reply {padding: 50px 4%;} /*speaker*/ #speaker { padding: 50px 4% 0 4%; } #speaker .container .speaker-list ul li {height: 220px;} /*speaker end*/ /*sponsor*/ #sponsor { padding: 50px 4% 0 4%; } /*contact*/ #contact { padding: 50px 4%; } /*.ticket-info-list*/ .ticket-info-list {padding:50px 4%;} .ticket-info-list .register-btn div a {padding: 25px 50px;} /*.ticket-event*/ .ticket-event {padding:50px 4%;} /*contents-title*/ section .container div .contents-title h3 {font-size: 2.7rem; padding-left: 23px;} section#contact .container div .contents-title h3 {font-size: 2.7rem; padding-left: 23px;} section .container div.ticket-info-list .contents-title h3 {background-size: 2.7rem;} section .container div.ticket-info-notice .contents-title h3 {background-size: 2.5rem;} section .container div.ticket-info-contact .contents-title h3 {background-size: 2.5rem;} section .container div.ticket-info-place .contents-title h3 {background-size: 2.5rem;} section .container div.ticket-event .contents-title h3 {background-size: 2.5rem;} /*ticket-info-notice*/ .ticket-info-notice {padding: 50px 4%;} /*ticket-info-contact*/ .ticket-info-contact {padding: 0 4% 50px 4%} /*contact*/ #contact .contact-email p {width: 35%; } #contact .contact-email a { width: 65%;} /*ticket-info-place*/ .ticket-info-place {padding: 50px 4%;} /*footer*/ footer {width: 92%; margin: 0 auto; padding: 0 0 30px 0; border:none;} } @media only screen and (max-width: 720px) { /*main*/ main {margin: 4% auto 0 auto;} .mo-br {display: block;} /*header*/ .hero-container {padding: 4% 0 13% 0;} .hero-container .btn {width: calc(50% - 10px);} .hero-container .btn a {background-size: 10rem;} .hero-sponsor li {background-size: 90%;} .hero-container .hero-title {height: 220px;background-size :90%;} .hero-sponsor li.sponsor-pc {background-size: 85%;} .gnb-toggle { display: block;} .gnb-container { display: none; position: absolute; top: 75px; right: 0; width: 100%; flex-direction: column; background-color: rgba(0,0,0,0.9); z-index: 999; gap: 20px; box-sizing: border-box; } .gnb-container.active { display: flex; } .gnb-wrapper { position: fixed; top: 0; left: 0; right: 0; width: 100%; z-index: 1000; background-color: rgba(0, 0, 0, 0.7); /* 반투명 검정 배경 */ display: flex; justify-content: space-between; align-items: center; padding: 20px; box-sizing: border-box; } .gnb-item { text-align: center; } .gnb-item.has-submenu {padding-bottom: 20px;} .submenu {width: 100%; top: 100%; background-color :rgba(0,0,0,0.9)} /*speaker*/ #speaker .container .speaker-list ul li {height: 190px;} /*speaker end*/ /*agenda*/ #agenda .container div div.agenda-content table {font-size: 1.4rem;} /*sessio-reply*/ #session-reply .container div div.reply-content table tbody tr td .reply-btn{width: calc(30% - 10px); } #session-reply .container div div.reply-content table tbody.track-detail tr td.track-session .reply-btn{width: calc( 80% - 10px);} /*ticket-info-place*/ .ticket-info-place .map {height: 240px} .ticket-info-place .map a {height: 240px} } @media only screen and (max-width: 480px) { body{} .mo-br {display: block;} .pc-br{display: none;} main {width: 100%; margin: 6% 0 0 0; background: none;} /*header*/ .hero-container {padding: 4% 0 20% 0;} .hero-container .hero-title {height:180px;} .gnb-wrapper .logo a img {width: 70%;} .hero-container .btn {width: calc(60% - 10px);} .hero-container .hero-date span {font-size: 1.4rem; color:#fff} .hero-sponsor li.sponsor-pc{display: none;} .hero-sponsor li.sponsor-mo{display: block; width: 100%; background: url('../images/sponsor_mo.png') center center no-repeat rgba(0,0,0,0.2); background-size: 60%;} .hero-container .session-btn {width:calc(50% - 10px)} .hero-container .hero-date span:last-child {background-size: 1.5rem;} .hero-container .hero-date span:nth-child(1) {background-size: 1.5rem;} #intro .container .intro-wrapper {padding: 30px 6%;} #intro .container .intro-wrapper h2 {font-size: 2.0rem;} #intro .container .intro-wrapper p {font-size: 1.4rem; color:#fff} #event-place .container .date-info {font-size: 1.4rem;} #event-place .container .date-info li:nth-child(1) {width :calc(70% - 10px); background-size: 1.5rem;} #event-place .container .date-info li:nth-child(2) {width :calc(90% - 10px);background-size: 1.5rem;} /*agenda*/ #agenda {padding: 30px 6%;} #agenda .container div div.agenda-content table {font-size: 1.2rem;} #agenda .container div div.agenda-content table tbody tr td p{font-size: 1.4rem;} #agenda .container div div.agenda-content table tbody tr td p.agenda-speaker {font-size: 1.2rem;} #agenda .container div div.agenda-content table tbody tr td p b {font-size: 1.2rem;} #agenda .container div div.agenda-content table tbody tr td.braze{background-size: 15%;} #agenda .container div div.agenda-content table tbody tr td.amplitude{background-size: 18%;} #agenda .container div div.agenda-content table tbody tr td.shopify{background-size: 15%;} #agenda .container div div.agenda-content table tbody tr td.martinee{background-size: 15%;} #agenda .container div div.agenda-content table tbody.track-detail tr td.snowflake{ background-size: 58%;} #agenda .container div div.agenda-content table tbody.track-detail tr td.wrtn{background-size: 25%;} #agenda .container div div.agenda-content table tbody.track-detail tr td.olivebraze{ background-size: 69%;} #agenda .container div div.agenda-content table tbody.track-detail tr td.amplitude{background-size: 50%;} #agenda .container div div.agenda-content table tbody.track-detail tr td.aws{background-size: 39%;} #agenda .container div div.agenda-content table tbody.track-detail tr td.alarmy{ background-size: 36%;} #agenda .container div div.agenda-content table tbody.track-detail tr td.dxe{background-size: 36%;} #agenda .container div div.agenda-content table tbody.track-detail tr td.goodwearmall{background-size: 52%;} #agenda .container div div.agenda-content table tbody.track-detail tr td.salesforce{background-size: 36%;} #agenda .container div div.agenda-content table tbody.track-detail tr td.cornerstone{background-size: 52%;} #agenda .container div div.agenda-content table tbody.track-detail tr td.cocone{background-size: 36%;} #agenda .container div div.agenda-content table tbody.track-detail tr td.tving{background-size: 33%;} #agenda .container div div.agenda-content table tbody.track-detail tr td.oliveyoung{background-size: 45%;} #agenda .container div div.agenda-content table tbody.track-detail tr td.ascent{background-size: 52%;} #agenda .container div div.agenda-content table tbody.track-detail tr td.bodac{background-size: 33%;} #agenda .container div div.agenda-content table tbody.track-detail tr td.hana{background-size: 35%;} #agenda .container div div.agenda-content table tbody.track-detail tr td.cjolive{background-size: 52%;} #agenda .container div div.agenda-content table tbody.track-detail tr td.miso{background-size: 33%;} #agenda .container div div.agenda-content table tbody.track-detail tr td.pannel{background-size: 66%; } #agenda .container div div.agenda-content table tbody tr.track td p {margin-top: 0;} /*sessio-reply*/ #session-reply { padding: 30px 6%;} #session-reply .container div div.reply-content table{background: rgba(0,0,0,0.3)} #session-reply .container div div.reply-content table tbody tr td {padding: 3%;} #session-reply .container div div.reply-content table tbody tr td .reply-btn{width: calc(30% - 10px); } #session-reply .container div div.reply-content table tbody tr td .reply-btn a {font-size: 1.2rem; padding-left: 14px; } #session-reply .container div div.reply-content table tbody.track-detail tr td.track-session .reply-btn{width: 95%;} #modal-shopify .modal-content .modal-title {padding-top: 35px;} #modal-shopify2 .modal-content .modal-title {padding-top: 35px;} #modal-martinee .modal-content .modal-title {padding-top: 35px;} /*agenda end*/ /*speaker*/ #speaker { padding: 30px 6% } #speaker .container .speaker-list ul li {width: calc(50% - 10px); height: 200px;} #speaker .container .speaker-list ul li:nth-child(2n) {margin-right: 0px;} #speaker .container .speaker-list ul li div h5 {font-size: 1.4rem;} #speaker .container .speaker-list ul li div span {font-size: 1.2rem;} #speaker .container .speaker-list ul li div p {font-size: 1.2rem;} /*speaker end*/ #sponsor { padding: 30px 6% } #sponsor .container .sponsor-list div {padding-bottom: 0;} #sponsor .container .sponsor-list div ul li{width: calc(50% - 10px); height: 60px;} #sponsor .container .sponsor-list div ul li:nth-child(2n) {margin-right: 0;} #sponsor .container .sponsor-list div.sponsor-list-02 ul li:nth-child(3) {margin-right: 0px;} #sponsor .container .sponsor-list div.sponsor-list-04 ul li:nth-child(9) {margin-bottom: 20px} #sponsor .container .sponsor-list div.sponsor-list-04 ul li:nth-child(10) {margin-bottom: 20px} #sponsor .container .sponsor-list div.sponsor-list-02 ul li:nth-child(1), #sponsor .container .sponsor-list div.sponsor-list-02 ul li:nth-child(2), #sponsor .container .sponsor-list div.sponsor-list-03 ul li:nth-child(5), #sponsor .container .sponsor-list div.sponsor-list-03 ul li:nth-child(6) {margin-bottom: 20px;} .ticket-info-list {padding: 30px 6%;} .ticket-info-list .register-btn .register-btn-pre div {background-size: 50%;} .ticket-info-list .register-btn .register-btn-onsite div {background-size: 50%;} .ticket-info-list .register-btn div p{ padding: 0; font-size: 2.3rem;} .ticket-info-list .register-btn div {padding: 4px 4px 10px 4px;} .ticket-info-list .register-btn div div {padding: 20px 40px;} .ticket-event {padding: 30px 6%;} .ticket-event .ticket-event-gift ul { display: flex; /* Flexbox를 사용 */ flex-direction: column; /* 세로 정렬 */ align-items: center; /* 자식 요소 가운데 정렬 */} .ticket-event .ticket-event-gift ul li { width: 100%; margin: 0 0 20px 0; background-size: cover; /* 이미지 크기 맞춤 */ background-position: center; /* 이미지 위치 설정 */ background-repeat: no-repeat; /* 반복 방지 */ position: relative; padding-top: 72%; /* 이미지의 종횡비(16:9라면 56.25%) */ height: 0; /* 높이를 없앰 (패딩으로 대체) */} .ticket-event .ticket-event-gift ul li:nth-child(3) {margin-bottom: 0;} .ticket-event .ticket-event-gift p {padding-top: 10px;} .ticket-info-notice {padding: 30px 6%;} .ticket-info-notice .notice p {font-size: 1.4rem;} .ticket-info-contact {padding: 0 6% 30px 6%} .ticket-info-contact .contact-email {font-size: 1.4rem;} .ticket-info-place {padding: 30px 6% 50px 6%;} .ticket-info-place p {font-size: 1.4rem;} .ticket-info-place .map {height: 200px; background-size: 150%;} .ticket-info-place .map a {height: 200px;} #contact { padding: 30px 6%; border-radius: 0; background: none; border-top: 1px solid rgba(255,255,255,0.1) } #contact .contact-email p {width: 35%; font-size:1.4rem;} #contact .contact-email a { width: 65%; font-size:1.4rem;} /* Footer */ footer {background: rgba(0,0,0,0.6); margin: 0; width: 100%; padding: 6% 6%; box-sizing: border-box; border: none;} footer .footer-wrapper .f-logo {background-size: 17rem} footer .footer-wrapper .f-text li {width: 100%; float: none; padding: 5px 0;} footer .footer-wrapper .f-text li:last-child {width: 100%; text-align: left;} }