@charset "utf-8";
@import url('components.css');

:root{
  /* ブランドカラー（グラデーション） ------------------------------ */
  --theme: #8DC2EA;
  --theme-light: #EBF2FB;
  --theme-pale: #F9FCFE;
  --theme-deep: #3D7FB3;   /* テーマ色の濃色（小さい文字・ホバー用） */
  --theme-line: #DCE7F1;   /* テーマ寄りの罫線 */
  --theme-line-pale: #EEF3F8;
  --gradient-theme: linear-gradient(135deg, var(--theme) 0%, var(--theme-light) 100%);
  --gradient-theme-to-right: linear-gradient(to right, var(--theme) 0%, var(--theme-pale) 100%);

  /* アクセントカラー ------------------------------------------------ */
  --brown: #702b2f;
  --teal: #3ed6c5;
  --teal-hover: #3ee6d4;
  --link: #06c;
  --link-hover: #09f;
  --blue-online: #006aff;
  --blue-online-hover: #00a7ff;
  --orange-visitor: #ff7300;
  --orange-visitor-hover: #ffa700;
  --sat-blue: #33d;
  --sun-red: #d33;
  --pale-yellow: #ffffcc;
  --banner-yellow: #efe425;    /* .menubnr */
  --banner-yellow-v2: #efc825; /* .menubnr_v2（意図的な別色） */
  --olive-accent: #ceca13;     /* 旧#cEcA13・#bEbA03 を統一 */
  --em-red: #f30;
  --wrap-bg: #fffde3;
  --adapter-bg: #f0e2ca;
  --redbtn-1: #ff4c52;
  --redbtn-2: #c9171e;
  --green-1: #b9d106;
  --green-2: #86cb05;

  /* 警告レッド（旧#f00・#f22 を統一） -------------------------------- */
  --red: #f00;
  --red-05: rgba(255,0,0,.05);
  --red-20: rgba(255,0,0,.2);
  --red-80: rgba(255,0,0,.8);

  /* テキストの濃淡（旧#565753は#555とほぼ同色のため統一） ------------ */
  --text-1: #333;
  --text-2: #474747;
  --text-3: #555;
  --text-4: #222;
  --text-nav: #6f6451;
  --black: #000;
  --white: #fff;

  /* グレースケール（近似色を統一） ----------------------------------- */
  --gray-f6: #f6f6f6;  /* 旧#fafafa・#f4f4f4・#fcfcfc を統一 */
  --gray-eee: #eee;    /* 旧#e6e6e6 を統一 */
  --gray-aaa: #aaa;
  --gray-666: #666;
  --gray-4d: #4d4d4d;

  /* オーバーレイ（黒・白の半透明） ----------------------------------- */
  --ink-05: rgba(0,0,0,.05);
  --ink-075: rgba(0,0,0,.075);
  --ink-10: rgba(0,0,0,.1);
  --ink-20: rgba(0,0,0,.2);
  --ink-40: rgba(0,0,0,.4);
  --ink-50: rgba(0,0,0,.5);
  --ink-70: rgba(0,0,0,.7);
  --ink-80: rgba(0,0,0,.8);
  --ink-90: rgba(0,0,0,.9);
  --paper-50: rgba(255,255,255,.5);
  --paper-80: rgba(255,255,255,.8);
  --paper-90: rgba(255,255,255,.9);

  /* トップボタン各色（rgb表記） --------------------------------------- */
  --btn-login: rgb(232,142,7);
  --btn-get: rgb(7,127,232);
  --btn-app: rgb(11,155,25);
  --btn-call: rgb(11,85,155);
}


/* 基本設定 ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
html, body{ font-size:16px; -webkit-text-size-adjust:none; background: url(../images/bg.png) left top no-repeat; background-attachment: fixed; }
a {text-decoration:none;color:var(--link); }
a:hover{text-decoration:none;color:var(--link-hover);}
a:hover img { opacity: 0.75; }
img{ max-width:100%; }

/* PC ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.swP { display: block; }
.swT { display: none; }
.swS { display: none; }
.swP.swT { display: block; }
.swP.swS { display: block; }
.swT.swS { display: none; }
.grad { display: inline-block; background: var(--gradient-theme); -webkit-background-clip: text; -webkit-text-fill-color: transparent; font-weight: inherit; font-size: inherit; line-height: inherit; }

body {  padding: 20px; }
.wrapper { max-width: 1200px; display: flex; justify-content: space-between; flex-wrap: wrap; margin: 0 auto; background: var(--white); border-radius: 10px; box-shadow: 0 0 8px var(--ink-20); }
header { width: calc(240px + 3rem); margin: 0; padding:0 1.5rem; }
header .logo a { display: flex; align-items: center; justify-content: center; width: 100%; height: 160px; background: url(../images/logo_bg.png) left top/cover no-repeat; border-bottom-left-radius: 7px; border-bottom-right-radius: 7px; }
header .logo a img { max-width: 80%; }
header nav { margin: 0; padding: 1rem 0; }
header nav li a { display: block; font-size: 1rem; line-height: 1.5; position: relative; }
header nav li a:before { content: ""; display: block; width: 100%; height: 1px; background: var(--gradient-theme); position: absolute; top:50%; right: 0; margin: 0; transition: .2s; will-change: transform; border-radius: 2px; }
header nav li a span { color: var(--text-nav); line-height: 18px; position: relative; display:inline-block; background: var(--white); padding: 5px 10px 5px 0; margin: 0; border-radius: 2px; position: relative; }
header nav li a em { color: var(--em-red); line-height: 18px; padding: 0 0 0 5px; font-size: 11px;}
header nav li a.current:before,
header nav li a:hover:before { height: 8px; top:calc(50% - 4px); }
header nav li a.current span,
header nav li a:hover span { color: var(--brown); }
header nav li.menuWebex { margin:10px 0; }
header nav li.menuWebex a {  border:3px solid var(--olive-accent); padding: 5px 10px; border-radius: 2px; background: var(--white); box-shadow: 0 3px 6px var(--ink-10); }
header nav li.menuWebex a:before { display: none; }
.menubnr { margin: 0 3px 10px; }
.menubnr a { display: flex; align-items: center; justify-content: center; min-height: 90px; box-sizing: border-box; background: var(--banner-yellow); padding:5px; border-radius: 2px; box-shadow: 0 3px 6px var(--ink-10), inset -1px -1px 0 var(--ink-10); }
.menubnr a span {  letter-spacing: .05em; background: transparent; color: var(--ink-90); font-weight: bold; text-align: center; display: block; padding: 5px 0; font-size: 13px; line-height: 1.4; }
.menubnr a:before { display: none; }
.menubnr a:hover { opacity: .75; }
.menubnr_v2 { margin: 0 3px 10px; }
.menubnr_v2 a { display: flex; align-items: center; justify-content: center; min-height: 90px; box-sizing: border-box; background: var(--banner-yellow-v2); padding:5px; border-radius: 2px; box-shadow: 0 3px 6px var(--ink-10), inset -1px -1px 0 var(--ink-10); }
.menubnr_v2 a span { letter-spacing: .05em;  background: transparent; color: var(--ink-90); font-weight: bold; text-align: center; display: block; padding: 5px 0; font-size: 13px; line-height: 1.4; }
.menubnr_v2 a span em { color: var(--em-red); font-size: 11px; }
.menubnr_v2 a:before { display: none; }
.menubnr_v2 a:hover { opacity: .75; }
.sidebnr { text-align: center; margin: 10px auto; background: var(--ink-05); }
.sidebnr img { text-align: center; margin: 0 auto; }

header .spmenu { display: none; transition: all .4s; box-sizing: border-box; position: fixed; top:26px; right: 20px; width: 22px; height: 18px; z-index: 9999; cursor: pointer; }
header .spmenu span { display: inline-block; transition: all .4s; box-sizing: border-box; position: absolute; left: 0; width: 100%; height: 2px; background-color: var(--gray-666); border-radius: 2px; }
header .spmenu span:nth-of-type(1) { top: 0; }
header .spmenu span:nth-of-type(2) { top: 8px; }
header .spmenu span:nth-of-type(3) { bottom: 0; }
header .spmenu.active span { background-color: var(--gray-4d); }
header .spmenu.active span:nth-of-type(1) { -webkit-transform: translateY(8px) rotate(-45deg); transform: translateY(8px) rotate(-45deg); }
header .spmenu.active span:nth-of-type(2) { opacity: 0; }
header .spmenu.active span:nth-of-type(3) { -webkit-transform: translateY(-8px) rotate(45deg); transform: translateY(-8px) rotate(45deg); }
header .headerbnr { background: var(--white); text-align: center; margin: 0 auto 10px; }
footer { width: 100%; clear: both; float: none; border-top: 1px dotted var(--gray-eee); padding: 10px; }
footer:after { content: ""; display: block; clear: both; }
footer dl { line-height: 1.5; float: left; font-size: 1rem; vertical-align: middle; display: flex; gap: .5rem; }
footer dl dt { line-height:1; font-size: .8rem; padding: .4em 1rem; background: var(--gradient-theme); color: var(--brown); font-weight: 600; vertical-align: middle; border-radius: 3px; display: flex; align-items: center; justify-content: center; }
footer dl dd { line-height:inherit; font-size: .8rem; vertical-align: middle; }
footer p { float: left; font-size: 0.6rem; }
footer small { float: right; font-size: 0.6rem; color:var(--gray-666); }
article { width: calc(100% - (240px + 3rem)); padding: 1.5rem 1.5rem 1.5rem 0; }
article section { padding: 0; }
article section h1 { line-height: 1.4; padding: 1rem; font-size: 1.4rem; color:var(--text-3); border:1px solid var(--gray-eee); border-bottom: none; font-weight: bold; letter-spacing: 2px; margin: 0 0 20px; position: relative; }
article section h1:after { content: ""; display: block; width: calc(100% + 2px); margin: 0 0 0 -1px; height: 4px; line-height: 4px; overflow:hidden; background: var(--theme); background: var(--gradient-theme-to-right); position: absolute; left: 0; bottom: 0; }
article section h2,
article section h3,
article section h4 { font-weight: 600; }
.h01 { font-weight: 700; margin: 0 0 2rem; font-size: 1.1rem; letter-spacing: 0.5px; position: relative; padding: 0 0 0 17px; }
.h01:after { content: ""; display: block; width: 5px; height:18px; line-height: 1px; overflow:hidden; background: var(--theme); background: var(--gradient-theme-to-right); position: absolute; left: 3px; top: 50%; margin: -10px 0 0; border-radius: 3px; }
.h02 { background: var(--gray-eee); font-size: 1.1rem; padding: 1rem; line-height: 1.5; font-weight: 700; margin: 0 0 2rem; border-radius: 3px; position: relative; }
.h02:after { content: ""; display: block; width: 4px; height:100%; line-height: 1px; overflow:hidden; background: var(--theme); background: var(--gradient-theme); position: absolute; left: 0; top: 0; border-radius: 3px; }

.h02 a { color:var(--blue-online); text-decoration: underline; display: inline-block; }
.h02 a:hover { text-decoration: none; }
.h03 { padding: 0 0 5px; margin: 0 0 10px; border-bottom: 1px dashed var(--gray-eee); font-weight: 700; }
.h04 { padding:10px; line-height: 1.2; border:1px solid var(--ink-10); margin: 0 0 10px; font-weight: 700; }
.h02 small,
.h03 small,
.h04 small { display: inline-block; padding: 0; color:var(--ink-40); font-weight: 600; font-size: 80%; line-height: inherit; }
.imgintxt { height: 1.5em; vertical-align: middle; margin: 0 0.5em; box-shadow:  0 0 1px var(--ink-50); }
.appbtnApple {display: inline-block; width: 200px; padding: 10px 10px 10px 50px; background: var(--text-4) url(../images/ico_apple.png) 10px center no-repeat; border-radius: 3px; text-align: left; color:var(--paper-90); transition: all .3s ease; }
.appbtnApple:hover { background-color: var(--gray-666); color: var(--white); }
.appbtnGoogle {display: inline-block; width: 200px; padding: 10px 10px 10px 50px; background: var(--text-4) url(../images/ico_google.png) 10px center no-repeat; border-radius: 3px; text-align: left; color:var(--paper-90); transition: all .3s ease; }
.appbtnGoogle:hover { background-color: var(--gray-666); color: var(--white); }

.watchBnr a { display: block; background: var(--teal); margin: 0 3px 20px; padding: 80px 5px 20px; line-height: 1.6; font-weight: bold; text-align: center; font-size: 13px; color: var(--ink-80); box-shadow: inset -1px -1px 0 var(--ink-10), 1px 3px 6px var(--ink-10); border-radius: 2px; position: relative; }
.watchBnr a::before { content: url(../images/ico_watch.svg); position: absolute; left: calc(50% - 30.02px); top: 20px; }
.watchBnr a:hover { background-color: var(--teal-hover); }

.btnLeaflet a { display: block; border:1px solid var(--gray-aaa); padding: 10px; margin: 0 auto 10px; opacity: 1; transition: opacity .4s; }
.btnLeaflet a img { width: 178px; height: 252px; object-fit: cover; margin: 0 auto; transition: padding .4s, opacity .4s; }
.btnLeaflet a dt { text-align: center; }
.btnLeaflet a dd { text-align: center; line-height: 1; padding: 10px 0 0; font-size: .9rem; font-weight: 600; color: var(--text-4); transition: color .6s; }
.btnLeaflet a:hover img { padding: 4px; opacity: .9; }
.btnLeaflet a:hover dd { color: var(--link-hover); }

.btnMenuTips a { display: flex; align-items: center; justify-content: center; width: 100%; height: 80px; padding: 5px 10px; box-sizing: border-box; background: var(--gray-eee); margin: 0 auto 10px; border-radius: 4px; box-shadow: 1px 2px 4px var(--ink-10), inset -3px -3px 2px var(--ink-075); transition: background-color .4s; position: relative; }
.btnMenuTips a:before { content: url(../images/btn_arw.svg); position: absolute; right: 10px; bottom: 10px; line-height: 1px; font-size: 1px; transition: .4s; }
.btnMenuTips a span { display: block; line-height: 1.1; font-size: .95rem; font-weight: 600; width: 100%; text-align: center; color:var(--white); text-shadow: 0 1px 3px var(--ink-10); }
.btnMenuTips a span small { margin: 4px auto 0; padding: 4px 0 0; display: block; line-height: 1.3; font-size: 11px; font-weight: 600; color:var(--white); border-top:1px solid var(--paper-50); letter-spacing: .04em; }
.btnMenuTips a:hover:before { right: 5px; }

.btnforVisitor a { background: var(--orange-visitor); }
.btnforVisitor a:hover { background-color: var(--orange-visitor-hover); }
.btnforOnline a { background: var(--blue-online); }
.btnforOnline a:hover { background-color: var(--blue-online-hover); }

article section p { margin: 0 0 1.5em; line-height: 2; }
article section p span { line-height: inherit; vertical-align: top; }
article section p strong { font-weight: bold; }
article section ol { margin: 0 0 1.5em; }
article section ul { margin: 0 0 1.5em; }
article section li { line-height: 2; }
article section aside { background: var(--ink-05); padding: 25px; margin: 20px auto; width: 90%; }
article section aside.red { background: var(--red-05); border:3px solid var(--red-20); }
article section aside table { border-spacing:0; }
article section aside table td,
article section aside table th { vertical-align: top; }


.topData { text-align: right; padding: 0 0 1.5rem; margin: 0 0 1.5rem; border-bottom: 1px solid var(--gray-eee); }
.topData .inr { display: inline-block; text-align: right; }
.topData dl { text-align: right; display: flex; align-items: center; justify-content: flex-end; vertical-align: baseline; line-height: 24px; }
.topData dt { font-size: 16px; letter-spacing: .05em; vertical-align: baseline; line-height: 24px; font-weight: bold; color:var(--text-3); }
.topData dt:after { content: "："; }
.topData dd { font-size: 16px; letter-spacing: .05em; vertical-align: baseline; line-height: 24px; font-weight: bold; color:var(--text-3); }
.topData dd em { font-size: 23px; vertical-align: baseline; line-height: 24px; color:var(--text-3); font-weight: bold; }
.topData dd span { vertical-align: baseline; line-height: 24px; color:var(--red); font-weight: bold; }
.topData dd span.sat { color:var(--sat-blue); }
.topData dd span.sun { color:var(--sun-red); }

i.pdf:after { content: url(../images/icon_pdf.gif); position: relative; top:1px; left: 5px; margin: 0 5px 0 0; }
#menu_add { width:100%; margin:0 0 1rem; font-size:0.7rem; line-height:130%; background:var(--gray-f6) none left top repeat; }
#menu_add a { display:block; /* padding:6px; */ text-decoration:none; /* border:1px solid var(--gray-eee); */ color:var(--text-2); text-align: center; }
#menu_add a:hover { /* border:1px solid var(--gray-eee); color:var(--gray-666); */ }
#menu_add a:hover img { opacity:0.8; filter: alpha(opacity=80); }
/* #menu_add img { margin:.5rem auto 0; } */

#menu_register { width:100%; margin:0 0 1rem; padding: 1em; font-size:0.7rem; line-height:130%; background:var(--gray-f6) none left top repeat; }
#menu_register a { display:block; /* padding:6px; */ text-decoration:none; /* border:1px solid var(--gray-eee); */ color:var(--text-2); text-align: center; }
#menu_register a:hover { /* border:1px solid var(--gray-eee); color:var(--gray-666); */ }
#menu_register a:hover img { opacity:0.8; filter: alpha(opacity=80); }

#menu_adobe { width:100%; margin:0 0 1rem; font-size:0.7rem; line-height:130%; background:var(--gray-f6) none left top repeat; }
#menu_adobe a { display:block; padding:6px; text-decoration:none; border:1px solid var(--gray-eee); color:var(--text-2); text-align: center; }
#menu_adobe a:hover { border:1px solid var(--gray-eee); color:var(--gray-666); }
#menu_adobe a:hover img { opacity:0.8; filter: alpha(opacity=80); }
#menu_adobe img { margin:.5rem auto 0; }
.topcatch { text-align: center; margin: 0 0 20px; }
.topcatch img { width: 100%; }
.pagetop { font-size:80%; text-align:right !important; margin:0 0 30px !important; clear:both; }
table.subjectTable { width:100%; margin:0 0 30px; background:var(--gray-eee) none 0 0 no-repeat; }
table.subjectTable th { padding:7px; background:var(--gray-f6) none 0 0 no-repeat; border:1px solid var(--white); width:10em; }
table.subjectTable td { padding:7px; background:var(--white) none 0 0 no-repeat; border:1px solid var(--white); }

table.subjectTable02 { width:100%; margin:0 0 30px; border-collapse: collapse; }
table.subjectTable02 th { padding: 1rem; border:1px solid var(--gray-aaa); vertical-align: top; background: var(--gray-f6); font-weight: 600; }
table.subjectTable02 td { padding: 1rem; border:1px solid var(--gray-aaa); vertical-align: top; }


table.aboutTable { width:100%; margin:0 0 30px; background:var(--gray-eee) none 0 0 no-repeat; }
table.aboutTable th { padding:7px; background:var(--gray-f6) none 0 0 no-repeat; border:1px solid var(--white); width:9em; }
table.aboutTable th.cY { background:var(--pale-yellow) none 0 0 no-repeat; border:1px solid var(--pale-yellow);}
table.aboutTable td { padding:7px; background:var(--white) none 0 0 no-repeat; border:1px solid var(--white); }
table.aboutTable td dl { overflow:hidden;}
table.aboutTable td dl dt { float:left; width: 6.5em;}
table.aboutTable td dl dd { overflow: hidden; }

table.aboutTable td dl dt { float:none; width: auto; font-weight: bold; background: var(--gray-f6); padding: 2px; margin: 0 0 5px; }
table.aboutTable td dl dl dt { background: none; line-height: 1.4; padding:5px 0 0; margin: 0; }
table.aboutTable td dl dd { overflow: hidden; line-height: 1.4; padding:0 0 5px; }


#subjectBtn { width:550px; overflow:hidden; margin:0 auto 30px; }
#subjectBtn li { width:234px; height:44px; overflow:hidden; margin:0 0 8px 12px; display:inline; float:left; }
#subjectBtn a { display:block; width:234px; height:44px; overflow:hidden; background:url(../images/btn_subject.gif) 0 0 no-repeat; transition: all 0s ease; }
#subjectBtn span { display:none; }

#subjectBtnRegisterSSL a { background-position:0 0; }
#subjectBtnEditSSL a { background-position:0 -44px; }
#subjectBtnRegisterBasic a { background-position:0 -88px; }
#subjectBtnEditBasic a { background-position:0 -132px; }

#subjectBtnRegisterSSL a:hover { background-position:-234px 0; }
#subjectBtnEditSSL a:hover { background-position:-234px -44px; }
#subjectBtnRegisterBasic a:hover { background-position:-234px -88px; }
#subjectBtnEditBasic a:hover { background-position:-234px -132px; }

ol.list { list-style-type: decimal; padding: 0 0 0 1.5em; }
ol.list li { list-style-type: decimal; }
ul.list { list-style-type: disc; padding: 0 0 0 1.5em; }
ul.list li { list-style-type: disc; }
table.exhibitionTable { width:100%; table-layout: fixed; margin:0 0 30px; background:var(--gray-eee) none 0 0 no-repeat; }
table.exhibitionTable th { font-size: 13px; text-align:center; padding:7px 0; background:var(--gray-f6) none 0 0 no-repeat; border:1px solid var(--white); }
table.exhibitionTable th.imitationCompany { width:220px;}
table.exhibitionTable th.imitationPr { width:326px;}
table.exhibitionTable th.number { width:70px; text-align: center; white-space: normal;}
table.exhibitionTable th.company { }
table.exhibitionTable th.pr { width:auto;}
table.exhibitionTable td { font-size: 13px; padding:7px; background:var(--white) none 0 0 no-repeat; border:1px solid var(--white); word-wrap: break-word; word-break: break-all; width: auto; }
/* ワークショップご参加に関するご案内 */
table.work_shop { width:100%; margin:0; background:var(--gray-eee) none 0 0 no-repeat; }
table.work_shop th { padding:7px; background:var(--pale-yellow) none 0 0 no-repeat; border:1px solid var(--pale-yellow); width:9em; }
table.work_shop td { padding:7px; background:var(--white) none 0 0 no-repeat; border:1px solid var(--white); }
.btn { display: inline-block; padding: 7px 3em 5px; border:3px solid var(--gray-666); text-decoration: none; color:var(--text-1); transition: background .4s, border-color .4s, color .4s; }
.btn:hover { background: var(--gray-666); border-color:var(--gray-666); color:var(--white); }
.btn.register { background: var(--teal); border:none; padding:15px 3em 13px; border-radius: 3px; box-shadow: inset -1px -1px 0 var(--ink-10), 1px 3px 6px var(--ink-10); font-weight: bold; color: var(--ink-70); transition: .3s; }
.btn.register:hover  { background: var(--teal-hover); border:none; color: var(--ink-70); }
.btn.large.register { padding:2em; min-width: 400px; line-height: 1; }

.btnlist { display: flex; flex-wrap: wrap;  margin: 2.5em 2.5rem 2rem; gap: 1rem; align-items: center; justify-content: center; }
.btnlist li a { display: inline-block; padding: 10px 20px 10px 30px; border:1px solid var(--gray-aaa); color: inherit; border-radius: 3px; min-width: 190px; text-align: center; box-shadow: 0 0 .5rem var(--ink-05); background: var(--gray-f6); transition: .4s; position: relative; box-sizing: border-box; }
.btnlist li a::before { content: ""; display: block; position: absolute; left: 10px; top: calc(50% - 6px); width: 0; height: 0; border-style: solid;   border-top: 6px solid transparent; border-bottom: 6px solid transparent; border-left: 10px solid var(--text-3); border-right: 0; }
.btnlist li a:hover { background: var(--teal-hover); }

.pagecatch { font-size: 1.5rem; color:var(--text-3); text-align: center; letter-spacing: 2px; margin:40px 0; font-family: Georgia,游明朝,"Yu Mincho",YuMincho,"Hiragino Mincho ProN",HGS明朝E,メイリオ,Meiryo,serif; }

.infobtns { display: flex; flex-wrap: wrap;  margin: 1em auto; }
.infobtns li { margin: 0 10px 10px 0; }
.infobtns li a { display: inline-block; padding: 10px; border:1px solid var(--gray-aaa); color: inherit; border-radius: 2px; border-radius: 3px; }
.infobtns li a:hover { background: var(--teal-hover); }


table.basictable { margin:0 0 20px; padding:0; border-collapse: separate; border-spacing: 0;}
table.basictable th{ width:100px; padding:5px; margin:0; background-color:var(--pale-yellow);  border:solid 1px var(--gray-aaa);}
table.basictable th.right{ width:100px; padding:5px; margin:0; background-color:var(--pale-yellow);  border:solid 1px var(--gray-aaa); border-left:none;}
table.basictable td{ width:100px; padding:5px; margin:0; border:solid 1px var(--gray-aaa);}
table.basictable td.top{ width:100px; padding:5px; margin:0; border:solid 1px var(--gray-aaa); border-top:none;}
table.basictable td.right_top{ width:100px; padding:5px; margin:0; border:solid 1px var(--gray-aaa); border-left:none; border-top:none;}
.redBtn a { font-size: 14px; text-decoration: none; display: block; width: 260px; line-height: 40px; height: 40px; text-align: center; margin: 0 auto; color: var(--white); border: var(--redbtn-2) 1px solid; transition: all 0.2s ease; border-radius: 3px; background: var(--redbtn-1); background: -moz-linear-gradient(top, var(--redbtn-1) 20%, var(--redbtn-2) 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(20%,var(--redbtn-1)), color-stop(100%,var(--redbtn-2))); background: -webkit-linear-gradient(top, var(--redbtn-1) 20%,var(--redbtn-2) 100%); background: -o-linear-gradient(top, var(--redbtn-1) 20%,var(--redbtn-2) 100%); background: -ms-linear-gradient(top, var(--redbtn-1) 20%,var(--redbtn-2) 100%); background: linear-gradient(to bottom, var(--redbtn-1) 20%,var(--redbtn-2) 100%); }
.redBtn a:hover { opacity:0.8; filter: alpha(opacity=80);}
.btn { display: inline-block; padding: 7px 3em 5px; margin: 1rem auto; border:3px solid var(--gray-666); text-decoration: none; color:var(--text-1); }
.btn:hover { background: var(--gray-666); border:3px solid var(--gray-666); color:var(--white); }

.wrap { background: var(--wrap-bg); padding: 20px; border-radius: 5px; }

.cancellation { border:4px solid var(--red); padding: 40px; margin:20px  0 0; }
.cancellation h1 { font-size: 1.15rem; font-weight: bold; color: var(--red); border-bottom: 2px solid var(--red); margin: 0 0 10px; padding: 0 0 10px; line-height: 1; }
.cancellation p { margin: 0 0 20px; color: var(--black); }
.cancellation h6 { text-align: right; font-size: .8rem; }

.greetingwrap { display: flex; justify-content: space-between; margin: 0 auto 30px; }
.greetingwrap .img { width: 240px; text-align: center; }
.greetingwrap .txt { width: calc(100% - 270px); text-align: center; }

.tips { margin: 0 auto 30px; max-height: 670px; overflow: auto; background: var(--white); border: 1px solid var(--theme-line); border-top: 3px solid var(--theme); scrollbar-width: thin; scrollbar-color: var(--theme-line) transparent; }
.tips h2 { position: sticky; top: 0; z-index: 1; display: flex; align-items: baseline; gap: 14px; margin: 0; padding: 20px 30px 16px; background: var(--white); border-bottom: 1px solid var(--theme-line); font-size: 1.15rem; font-weight: bold; letter-spacing: .12em; color: var(--text-1); }
.tips h2 span { font-family: "Helvetica Neue", Arial, sans-serif; font-size: .72rem; font-weight: bold; letter-spacing: .3em; color: var(--theme-deep); }
.tips h2 em { font-weight: bold; color: var(--red); }
.tips p { font-weight: bold; }
.tips p em { color: var(--red-80); font-weight: bold; }
.tips p:last-of-type { margin-bottom: 0; padding-bottom: 0; }
.tips dl { display: grid; grid-template-columns: 7em 1fr; align-items: baseline; gap: 28px; margin: 0; padding: 16px 30px; border-bottom: 1px solid var(--theme-line-pale); }
.tips dl:last-of-type { border-bottom: none; }
.tips dl dt { font-family: "Helvetica Neue", Arial, sans-serif; font-size: .8rem; font-weight: normal; letter-spacing: .08em; color: var(--gray-aaa); font-variant-numeric: tabular-nums; }
.tips dl:first-of-type dt::after { content: "NEW"; margin-left: 8px; font-size: .62rem; font-weight: bold; letter-spacing: .12em; color: var(--theme-deep); }
.tips dl dd { margin: 0; font-size: .98rem; line-height: 1.8; color: var(--text-2); }
.tips dl dd em { color: var(--red-80); font-weight: bold; font-size: inherit; }
.tips dl dd a { color: var(--text-1); border-bottom: 1px solid var(--theme-line); transition: color .2s, border-color .2s; }
.tips dl dd a:hover { color: var(--theme-deep); border-color: var(--theme); }

.tips_contact { position: absolute; right: 20px; bottom: 390px; width: 400px; padding: 1rem; background: var(--paper-90); }
.tips_contact h5 { font-weight: 600; color: var(--ink-90); line-height: 1.1; padding: 0 0 1rem; margin: 0 auto 1rem; font-size: 1.2rem; border-bottom: 1px solid var(--ink-40); }
.tips_contact h6 { font-weight: 600; color: var(--ink-90); line-height: 1.1; padding: 1rem 0; font-size: 1.2rem; color: var(--orange-visitor); }
.tips_contact p { color: var(--ink-90); line-height: 1.5; }

ul.webexhibitionList { border-top: 1px solid var(--ink-10); }
ul.webexhibitionList li { padding: 15px 0 15px 30px; border-bottom: 1px solid var(--ink-10); position: relative; }
ul.webexhibitionList li::before { content: ""; display: block; width: 6px; height: 6px; border-radius: 100px; background: var(--gray-aaa); line-height: 1px; font-size: 1px; position: absolute; left: 10px; top:calc(50% - 3px); }

ul.linklist { width: 80%; margin: 60px auto; }
ul.linklist li { margin: 0 auto 15px; }
ul.linklist li a { font-weight: bold; display: flex; align-items: center; justify-content: center; border:1px solid var(--gray-aaa); padding: 0; line-height: 1.4; text-align: center; min-height: calc((1.4em * 3) + 20px); border-radius: 3px; box-shadow: 0 3px 6px var(--ink-10); color: inherit; background: var(--gray-f6); transition: .3s; }
ul.linklist li a:hover { background: var(--gray-f6); color: var(--olive-accent); }

.topcatch { position: relative; }
.topBtns { position: absolute; width: calc(100% - 40px); left: 20px; top: min(62.5vw, 810px); }
.topBtns ul { width: 100%; padding: 20px; display: flex; gap: 20px; background: var(--paper-90); }
.topBtns ul li { width: calc((100% - 20px) / 2); margin: 0 auto; display: flex; }
.topBtns ul li a { display: flex; align-items: center; justify-content: center; width: 100%; padding: 15px; border:2px solid var(--ink-20); background: var(--white); border-radius: 5px; box-shadow: 3px 3px 6px var(--ink-05), inset -6px -6px 6px var(--ink-05); position: relative; transition: .4s; }
.topBtns ul li a::before { content: ""; position: absolute; right: 10px; bottom: 10px; width: 0; height: 0; border-style: solid; border-width: 0 0 8px 8px; border-color: transparent transparent var(--gray-4d) transparent; }
.topBtns ul li a:hover { opacity: .7; }
.topBtns ul li dt { text-align: center; line-height: 1.2; font-size: 1.2rem; font-weight: 600; margin: 0 auto 10px; letter-spacing: .05em; display: flex; align-items: center; justify-content: center; }
.topBtns ul li dt small { text-align: center; line-height: 1.2; font-size: .9rem; font-weight: 600; margin: 0 .5em; }
.topBtns ul li dd { text-align: center; line-height: 1.4; font-size: .9rem; padding: 10px 0 0; border-top:1px solid var(--ink-10) }
.topBtns ul li dd small { font-size: .7rem; line-height: 1.4; }
.topBtns ul li.topBtnLogin { width: 85%;}
.topBtns ul li.topBtnLogin a { background: var(--btn-login); }
.topBtns ul li.topBtnLogin a dt,
.topBtns ul li.topBtnLogin a dd { color: var(--white); }
.topBtns ul li.topBtnLogin a::before { border-color: transparent transparent var(--white) transparent; }
.topBtns ul li.topBtnGet a { background: var(--btn-get); }
.topBtns ul li.topBtnGet a dt,
.topBtns ul li.topBtnGet a dd { color: var(--white); }
.topBtns ul li.topBtnGet a::before { border-color: transparent transparent var(--white) transparent; }
.topBtns ul li.topBtnApp a { border-color: var(--btn-app); }
.topBtns ul li.topBtnApp a dt { color: var(--btn-app);}
.topBtns ul li.topBtnCall a { border-color:var(--btn-call); }
.topBtns ul li.topBtnCall a dt { color: var(--btn-call); }

.inBtns { }
.inBtns ul { margin: 20px; background: var(--paper-90); }
.inBtns ul li { margin: 0 auto 10px; }
.inBtns ul li:nth-last-child(1) { margin: 0 auto; }
.inBtns ul li a { display: block; padding: 15px; border:2px solid var(--ink-20); background: var(--white); border-radius: 5px; box-shadow: 3px 3px 6px var(--ink-05), inset -6px -6px 6px var(--ink-05); position: relative; transition: .4s; }
.inBtns ul li a::before { content: ""; position: absolute; right: 10px; bottom: 10px; width: 0; height: 0; border-style: solid; border-width: 0 0 8px 8px; border-color: transparent transparent var(--gray-4d) transparent; }
.inBtns ul li a:hover { opacity: .7; }
.inBtns ul li dt { text-align: center; line-height: 1.2; font-size: 1.2rem; font-weight: 600; margin: 0 auto 10px; letter-spacing: .05em; display: flex; align-items: center; justify-content: center; }
.inBtns ul li dt small { text-align: center; line-height: 1.2; font-size: .9rem; font-weight: 600; margin: 0 .5em; }
.inBtns ul li dd { text-align: center; line-height: 1.4; font-size: .9rem; padding: 10px 0 0; border-top:1px solid var(--ink-10) }
.inBtns ul li dd small { font-size: .7rem; line-height: 1.4; }
.inBtns ul li.topBtnLogin a { background: var(--btn-login); }
.inBtns ul li.topBtnLogin a dt,
.inBtns ul li.topBtnLogin a dd { color: var(--white); }
.inBtns ul li.topBtnLogin a::before { border-color: transparent transparent var(--white) transparent; }
.inBtns ul li.topBtnGet a { background: var(--btn-get); }
.inBtns ul li.topBtnGet a dt,
.inBtns ul li.topBtnGet a dd { color: var(--white); }
.inBtns ul li.topBtnGet a::before { border-color: transparent transparent var(--white) transparent; }
.inBtns ul li.topBtnApp a { border-color: var(--btn-app); }
.inBtns ul li.topBtnApp a dt { color: var(--btn-app);}
.inBtns ul li.topBtnCall a { border-color:var(--btn-call); }
.inBtns ul li.topBtnCall a dt { color: var(--btn-call); }

.applink { display: flex; align-items: center; }
.applink dd { margin: 0 0 0 1rem; }
.applink dd img { width: 100px; }

body { counter-reset: number 0; }
.alternative_therapy_wrap { margin: 3rem auto 6rem; }
.alternative_therapy_wrap h2 { margin: 0 auto 3rem; padding: 1rem; font-size: 1.2rem; line-height: 1.25; background: var(--ink-10); }
.alternative_therapy_wrap dl { width: 100%; display: flex; border-bottom: 1px solid var(--ink-20); position: relative; }
.alternative_therapy_wrap dl:nth-of-type(1) { border-top: 1px solid var(--ink-20); }
.alternative_therapy_wrap dl:before { counter-increment: number 1; content: counter(number) " "; display: inline-block; width: 1.5em; text-align: center; position: absolute; left: 1rem; top:calc(50% - .5em); font-size: 2.6rem; line-height: 1; color: var(--ink-20); }
.alternative_therapy_wrap dt { width: 16rem; background: var(--ink-05); padding: 1rem 1rem 1rem 6rem; display: flex; align-items: center; line-height: 1.5; }
.alternative_therapy_wrap dt br { display: none; }
.alternative_therapy_wrap dd { width: calc(100% - 16rem); padding: 1rem; }
.alternative_therapy_wrap h3 { font-size: 1.1rem; line-height: 1.5; }
.alternative_therapy_wrap p { margin: 0; padding: 0; vertical-align: middle; line-height: 1.5; }
.alternative_therapy_wrap p small { margin: 0 .5em; }
.alternative_therapy_wrap h4 { background: var(--ink-05); padding: 1rem; text-align: center; border-bottom: 1px solid var(--ink-20); }

.scheduleList {}
.scheduleList h4 { margin: 0 auto 1rem; color: var(--theme); font-size: 1.3rem; }
.scheduleList dl { display: flex; width: 100%; border-bottom: 1px solid var(--ink-10); padding: 0 0 1rem; margin: 0 auto 1rem; }
.scheduleList dl dt { width: 11rem; }
.scheduleList dl dd { width: calc(100% - 11rem); }

.list_indent {margin-left: 2.0em; text-indent: -1.0em;}

.sponsorshipList .inr { margin: -10px auto 3rem; var(--ink-10); }
.sponsorshipList dl { margin: 0 auto; padding: 1rem 0; border-bottom: 1px solid var(--ink-10); display: flex; align-items: center; }
.sponsorshipList dt { width: 300px; }
.sponsorshipList dd { width: calc(100% - 300px); }

.forPerformer a { display: flex; align-items: center; justify-content: flex-start; padding: 1rem; text-align: center; width: 100%; background: linear-gradient(135deg,  var(--green-1) 0%,var(--green-2) 100%); color: var(--white); box-sizing: border-box; border:2px solid var(--brown); line-height: 1.25; border-radius: 2px; overflow: hidden; position: relative; transition: .4s; }
.forPerformer a::before { content: ""; display: block;  width: 0; height: 0; border-style: solid; border-right: 200px solid transparent; border-left: 200px solid transparent; border-bottom: 200px solid var(--ink-05); border-top: 0; transform: rotate(315deg); position: absolute; left: -250px; top:-100px; transition: .8s; }
.forPerformer a::after { content: ""; display: block; position: absolute; right: 20px; top: calc(50% - 15px); width: 0; height: 0; border-style: solid; border-top: 15px solid transparent; border-bottom: 15px solid transparent; border-left: 10px solid var(--paper-80); border-right: 0; text-shadow: 0em 0em .1em var(--ink-10); transition: .4s; }
.forPerformer a span { color: inherit; font-size: 1.25rem; font-weight: 500; letter-spacing: .04em; line-height: inherit; position: relative; z-index: 100; display: inline-block; padding: 0 7px 0 0; }
.forPerformer a small { font-size: 70%; position: relative; }
.forPerformer a small::before { content: ""; display: block; width: 100%; position: absolute; left: 0; top:-6px; border-top: 1px solid var(--white);}
.forPerformer a:hover { opacity: .9; padding-left: calc(1rem + 5px); }
.forPerformer a:hover::before { left: -130px; }
.forPerformer a:hover::after { right: 15px;  }

.adapterimg { display: flex; justify-content: center; gap: 1rem; flex-wrap: wrap; margin: 1rem auto;}
.adapterimg dl { width: 180px; border: 1px solid var(--ink-10);}
.adapterimg dl dt { padding: .5em; line-height: 1; background-color: var(--adapter-bg); text-align: center; }
.adapterimg dl dd { padding: .5em; text-align: center; }

.greetingwrap { display: flex; justify-content: space-between; margin: 0 auto 30px; }
.greetingwrap .img { width: 240px; text-align: center; }
.greetingwrap .txt { width: calc(100% - 250px); text-align: center; }

.joint_seminar_list { margin: 60px auto; }
.joint_seminar_list h2 { line-height: 1.4; padding: 1rem; font-size: 1.4rem; color:var(--text-3); border:1px solid var(--gray-eee); border-bottom: none; font-weight: bold; letter-spacing: 2px; margin: 0 0 30px; position: relative; }
.joint_seminar_list h2:after { content: ""; display: block; width: calc(100% + 2px); margin: 0 0 0 -1px; height: 4px; line-height: 4px; overflow:hidden; background: var(--gradient-theme); position: absolute; left: 0; bottom: 0; }
.joint_seminar_list h3 { font-size: 1.3rem; padding: 0 0 30px; margin: 0 auto 30px; line-height: 1; border-bottom: 1px solid var(--ink-10); }

.jointwrap { margin: 0 auto 60px;  }
.jointwrap h4 { width: 100%; padding: 1rem; line-height: 1.5; background: var(--ink-05); font-size: 1.1rem; font-weight: 500; letter-spacing: .04em; margin: 0 auto 15px; position: relative; }
.jointwrap h4:after { content: ""; display: block; width: 100%; margin: 0; height: 1px; line-height: 1px; overflow: hidden; background: var(--gradient-theme); position: absolute; left: 0; bottom: 0; }
.jointwrap h4 small { font-size: 80%; font-weight: 600; }
.jointwrap h5 { font-weight: 600; }
.jointwrap .txt > dl { width: 100%; display: flex; margin: 10px auto; }
.jointwrap .txt > dl > dt { width: 11rem; }
.jointwrap .txt > dl > dd { width: calc(100% - 11rem); }
.jointwrap .txt > dl > dd > dl {  width: 100%; display: flex; }
.jointwrap .txt > dl > dd > dl > dt { width: 6rem; }
.jointwrap .txt > dl > dd > dl > dd { width: calc(100% - 6rem); }
.jointwrap:has(img) { display: flex; justify-content: space-between; flex-wrap: wrap; flex-direction: row-reverse; }
.jointwrap:has(img) .txt { width: calc((100% - 2rem) - 200px); }
.jointwrap:has(img) .img { width: 200px; }

.sidetips { padding: .5rem; margin-bottom: 1em; border: 3px dotted var(--black); border-color: red; font-weight: bold; color:red; font-size: 0.9em; }
.tipswrap { border:1px solid var(--red); color:var(--red); padding: 15px; margin: 30px auto; }
.sealtable td { padding-left: 1em; }
.greetingwrap h3 small { color: inherit; }

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
@media print, screen and (max-width:1024px) {
.swP { display: none; }
.swT { display: block; }
.swS { display: none; }
.swP.swT { display: block; }
.swP.swS { display: none; }
.swT.swS { display: block; }

.topBtns { position: static; width: 100%; }
.topBtns ul { display: block; width: auto; padding: 20px 0 1px; }
.topBtns ul li { width: 100%;}
.topBtns ul li.topBtnLogin { width: 100%; margin: 0 auto 10px; }
.topBtns ul li dt { font-size: 1rem; letter-spacing: 0; }
.topBtns ul li dt small { font-size: .7rem; letter-spacing: 0; }
.topBtns ul li dd { font-size: .8rem; letter-spacing: 0; }
.topBtns ul li dd small { font-size: .7rem; letter-spacing: 0; }

.alternative_therapy_wrap dl:before { top:.5rem; left: .5rem; font-size: 1rem; font-weight: 600; width: auto; }
.alternative_therapy_wrap dt { width: 6rem;  padding: 1rem; font-size: .8rem; font-weight: 600;}
.alternative_therapy_wrap dt br { display: block; }
.alternative_therapy_wrap dd { width: calc(100% - 6rem); }
.alternative_therapy_wrap p small { margin: 0; display: block; }

}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
@media print, screen and (max-width:780px) {
.swP { display: none; }
.swT { display: none; }
.swS { display: block; }
.swP.swT { display: none; }
.swP.swS { display: block; }
.swT.swS { display: block; }

body { padding: 10px; }
.wrapper { padding: 0 10px; display: block; }
header { width: auto; float: none; margin: 0 0 10px; padding: 0; }
header .logo a { width: 110px; height: 90px; }
header .spmenu { display: inline-block; }
header nav, #menu_add, #menu_register, #menu_adobe, .btnLeaflet, .watchBnr, .menubnr, .menubnr_v2 { display: none; }
header nav { width: auto; }
article { width: auto; float: none; margin: 0; padding: 0; }
footer dl { float: none; width: 100%; }
footer dl dt { width: 1.8em; }


#menu_add,
#menu_adobe { margin: 0 auto 10px; }
.topData { position: absolute; top:31px; left: 150px; margin: 0 50px 0 0; border:none; padding: 0; }
.topData .inr { text-align: left; width: 100%; }
.topData dl { text-align: left; align-items: flex-start; justify-content: flex-start; width: 100%; }
.topData dt { display: none; }
.topData dd { font-size: 10px; line-height: 15px; width:100%; }
.topData dd em { font-size: 1rem; display: inline; line-height: 15px; }

.cancellation { padding: 15px; }
.watchBnr a { margin: 0 3px 20px; }
.menubnr { margin:10px 0; }
.menubnr_v2 { margin:10px 0; }
.btn { display: block; padding: 7px 5px 5px; }

.greetingwrap .img { width: 80px; }
.greetingwrap .txt { width: calc(100% - 90px); }

.btn.large.register { min-width: 0; }

.jointwrap { display: block; }
.jointwrap .img { width: auto; text-align: center; margin: 0 auto 1rem; }
.jointwrap .txt { width: auto; margin: 0 auto 3rem; }

.tips_contact { position: static; width: auto; margin: 0 auto; padding: 20px 0 0; }
.tips_contact h5,
.tips_contact h6 { font-size: 4.7vw; }

#subjectBtn { width:auto; }
#subjectBtn li { display: block; margin: 0 auto .5rem; float:none; text-align: center; width: auto; }
#subjectBtn li a { margin: 0 auto; }

.scheduleList dl { display: block; }
.scheduleList dl dt { width: auto; font-weight: 600; }
.scheduleList dl dd { width:auto; }

.sponsorshipList dl { display: block; }
.sponsorshipList dt { width: auto; font-weight: 600; font-size: 80%; color: var(--ink-40); }
.sponsorshipList dd { width: auto; }

.greetingwrap .img { width: 80px; }
.greetingwrap .txt { width: calc(100% - 90px); }

.btn.large.register { min-width: 0; }

.jointwrap .txt > dl { display: block;}
.jointwrap .txt > dl > dt { width: auto; font-size: .8rem; color: var(--ink-40); font-weight: 600; }
.jointwrap .txt > dl > dd { width: auto; }
.jointwrap:has(img) { display: block; }
.jointwrap:has(img) .txt { width: auto; }
.jointwrap:has(img) .img { width: auto; text-align: center; margin: 0 auto 1rem; }
.jointwrap:has(img) .img img { max-width: 200px; }

.tips h2 { padding: 16px 18px 12px; }
.tips dl { grid-template-columns: 1fr; gap: 4px; padding: 14px 18px; }

}
@media print, screen and (max-width:360px) {
	.topData { display: none; }
}
