/* j2wave v1.2: 실제 사진 배경 + 로그인 링크 + 메인/하위 화면 분리 */
body { margin:0; }
.j2-landing, .j2-landing * { box-sizing:border-box; }
.j2-landing { font-family:Arial,"Apple SD Gothic Neo","Malgun Gothic",sans-serif; }
.j2-home {
  min-height:100svh; position:relative; isolation:isolate; overflow:hidden;
  display:flex; flex-direction:column; color:#fff;
  /* 사진 출처: Greg Bulla / Unsplash (https://unsplash.com/photos/neXcVVvm7No) */
  background-color:#2e6478;
  background-image: linear-gradient(180deg,rgba(8,36,62,.28) 0%,rgba(0,0,0,.03) 40%,rgba(4,24,46,.24) 100%),
    url('https://images.unsplash.com/photo-1688269946755-cb1294241a8d?auto=format&fit=crop&w=2400&q=85');
  background-size:cover; background-position:center center;
}
.j2-custom-photo{position:absolute;inset:0;z-index:0;background-position:center;background-size:cover;}
.j2-custom-photo::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(6,38,58,.23),rgba(0,0,0,.01) 42%,rgba(0,19,38,.22));}
.j2-header{position:relative;z-index:2;width:100%;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:24px clamp(20px,5vw,88px);}
.j2-header a{color:inherit;text-decoration:none;}
.j2-brand{display:block;flex-shrink:0;min-width:110px;font-family:"Segoe Script","Brush Script MT",cursive;font-weight:900;font-style:italic;font-size:clamp(26px,2.6vw,43px);letter-spacing:-.07em;line-height:1.05;}
.j2-brand span{display:inline-flex;flex-direction:column;align-items:center;}
.j2-brand i{height:4px;width:65%;background:#75d4e0;border-radius:100%;transform:rotate(-5deg);margin-top:2px;}
.j2-brand img{display:block;max-width:180px;max-height:60px;object-fit:contain;}
.j2-nav{display:flex;align-items:center;justify-content:flex-end;gap:clamp(14px,2.4vw,35px);flex-wrap:wrap;}
.j2-nav a{font:700 clamp(11px,1.05vw,14px)/1.4 Arial,sans-serif;letter-spacing:.13em;white-space:nowrap;padding:6px 0;border-bottom:2px solid transparent;}
.j2-nav a:is(:hover,:focus-visible),.j2-nav .j2-current{border-bottom-color:#8cdde7;}
.j2-nav .j2-account{border:1px solid rgba(255,255,255,.65);border-radius:20px;padding:8px 13px;letter-spacing:.07em;}
.j2-nav .j2-account:hover{background:rgba(255,255,255,.15);border-color:#fff;}
.j2-hero-center{position:relative;z-index:2;flex:1;min-height:420px;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;padding:65px 20px 120px;text-shadow:0 2px 16px rgba(10,37,56,.23);}
.j2-title{position:relative;margin:0 0 18px;font-family:"Segoe Script","Brush Script MT",cursive;font-size:clamp(68px,10vw,150px);font-style:italic;font-weight:900;letter-spacing:-.09em;line-height:1.1;}
.j2-title span{display:block;transform:rotate(-5deg);}
.j2-title img{display:block;width:min(70vw,600px);max-height:200px;object-fit:contain;}
.j2-swoosh{display:block;width:65%;height:11px;margin:-4px 0 0 auto;background:#76d8e5;border-radius:100%;clip-path:polygon(0 68%,26% 25%,48% 0,76% 50%,100% 60%,76% 100%,42% 73%,19% 92%);transform:rotate(-2deg);}
.j2-tagline{font-size:clamp(15px,2.2vw,30px);font-weight:700;letter-spacing:clamp(.16em,.5vw,.41em);margin:8px 0 20px;line-height:1.5;}
.j2-note{display:flex;flex-direction:column;margin:0;font-family:"Segoe Script","Brush Script MT",cursive;font-size:clamp(23px,2.45vw,37px);font-style:italic;line-height:1.4;transform:rotate(-6deg);}
.j2-note:after{content:"";height:2px;width:55%;background:rgba(255,255,255,.9);align-self:center;transform:rotate(-6deg);margin-top:5px;}
.j2-footer{position:relative;z-index:2;display:flex;align-items:end;justify-content:space-between;min-height:78px;padding:27px clamp(20px,4.7vw,75px) 16px;background:#f9f3ec;color:#343e43;clip-path:polygon(0 24%,3% 18%,7% 38%,12% 29%,18% 50%,24% 39%,30% 53%,36% 48%,43% 66%,49% 52%,56% 60%,62% 44%,69% 52%,75% 34%,83% 48%,89% 22%,94% 23%,100% 7%,100% 100%,0 100%);}
.j2-footer small{font-size:12px;letter-spacing:.12em;}
.j2-footer-wave{font-size:48px;line-height:.7;color:#1e8ba5;}
/* 로그인/회원가입/기타 페이지는 배경사진 아래로 밀리지 않도록 별도 화면 */
.j2-interior{min-height:100vh;background:#faf7f2;color:#283c44;}
.j2-interior .j2-header{background:#20586c;color:#fff;}
.j2-page-content{max-width:1080px;margin:0 auto;padding:48px 24px 90px;min-height:70vh;}
@media(max-width:700px){
  .j2-header{padding:18px 17px;align-items:flex-start;gap:12px;}
  .j2-brand{font-size:27px;min-width:82px;}
  .j2-brand img{max-width:110px;}
  .j2-nav{gap:9px 14px;}
  .j2-nav a{font-size:10px;letter-spacing:.05em;}
  .j2-nav .j2-account{padding:6px 9px;}
  .j2-hero-center{min-height:410px;padding:50px 18px 105px;}
  .j2-title{font-size:clamp(59px,16vw,100px);}
  .j2-tagline{font-size:clamp(12px,3.2vw,18px);letter-spacing:.1em;}
  .j2-note{font-size:clamp(18px,5vw,27px);}
  .j2-footer{min-height:72px;}
  .j2-page-content{padding:24px 15px 50px;}
}


/* v1.2 XEDITION-style account + search in the header */
.j2-header-right{display:flex;align-items:center;justify-content:flex-end;gap:clamp(12px,2vw,30px);min-width:0;}
.j2-search-menu,.j2-user-menu{position:relative;flex:none;}
.j2-search-menu summary,.j2-user-menu summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:center;}
.j2-search-menu summary::-webkit-details-marker,.j2-user-menu summary::-webkit-details-marker{display:none;}
.j2-icon-button{color:inherit;width:38px;height:38px;border-radius:50%;background:transparent;border:0;}
.j2-icon-button:focus-visible{outline:2px solid #86e5ec;outline-offset:3px;}
.j2-search-menu .j2-icon-button svg{display:block;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;}
.j2-avatar{width:38px;height:38px;object-fit:cover;border-radius:50%;display:block;}
.j2-profile-button svg{width:38px;height:38px;display:block;}
.j2-user-panel,.j2-search-panel{position:absolute;z-index:50;right:0;top:calc(100% + 12px);background:#303033;color:#f0f0f0;min-width:195px;box-shadow:0 14px 36px rgba(0,0,0,.23);border-radius:2px;}
.j2-user-panel:before,.j2-search-panel:before{content:"";position:absolute;right:14px;top:-8px;border-right:8px solid transparent;border-left:8px solid transparent;border-bottom:8px solid #303033;}
.j2-user-panel{padding:9px 0;max-height:65svh;overflow-y:auto;}
.j2-user-panel a{display:block!important;color:#d6d6d6!important;font:400 14px/1.4 Arial,'Malgun Gothic',sans-serif!important;letter-spacing:0!important;padding:11px 19px!important;border:none!important;white-space:nowrap;text-decoration:none;}
.j2-user-panel a:hover,.j2-user-panel a:focus-visible{color:#fff!important;background:#464649;}
.j2-welcome{font-size:12px;padding:11px 19px 9px;color:#9fe0e6;border-bottom:1px solid #555;word-break:break-all;}
.j2-search-panel{min-width:min(360px,calc(100vw - 24px));padding:17px;}
.j2-search-panel label{font-size:13px;display:block;margin-bottom:9px;}
.j2-search-row{display:flex;align-items:stretch;gap:7px;}
.j2-search-row input{flex:1;min-width:0;min-height:35px;padding:6px 10px;font-size:14px;border:1px solid #bbb;background:#fff;color:#333;}
.j2-search-row button{border:0;background:#74cedb;color:#153c49;font-weight:bold;padding:6px 10px;cursor:pointer;}
@media(max-width:700px){
 .j2-header-right{gap:7px;}
 .j2-nav{gap:10px;}
 .j2-nav a{font-size:11px;}
 .j2-header{flex-wrap:wrap;}
 .j2-icon-button{width:31px;height:31px;}
 .j2-search-menu svg{width:23px;height:23px;}
 .j2-avatar,.j2-profile-button svg{width:32px;height:32px;}
 .j2-user-panel{right:-4px;min-width:180px;}
}

/* v1.3: 프로필 드롭다운을 가리던 hero 레이어의 클릭 차단 해결.
   동일 z-index의 뒤쪽 DOM 요소(hero)가 헤더 위에 그려졌던 문제를 수정. */
.j2-landing .j2-header { position: relative; z-index: 1000; }
.j2-landing .j2-hero-center { position: relative; z-index: 1; }
.j2-landing .j2-footer { position: relative; z-index: 1; }
.j2-header-right, .j2-user-menu, .j2-search-menu { position: relative; }
.j2-user-menu[open], .j2-search-menu[open] { z-index: 1010; }
.j2-user-menu[open] .j2-user-panel, .j2-search-menu[open] .j2-search-panel { pointer-events: auto; }