@charset "utf-8";
h2{margin:30px auto;}
@media only screen and (min-width:600px) {
h2{margin-top:40px;}
}
@media only screen and (min-width:768px) {
h2{margin-top:120px;}
}
@media (orientation: landscape) and (min-width:960px){
h2{margin:120px 0 30px;}
}
#livebox{padding:30px 20px; min-height:70vh;}
#livebox a{color:#fff; text-decoration:underline;}

#livebox .livebox{text-align:left; max-width:600px; margin:0 auto;}
/* #livebox .livebox{padding-top:50px; margin-top:-50px;} */
#livebox .livebox .livetitle{margin-top:60px; padding-bottom:8px; margin-bottom:8px; border-bottom:1px solid #999;}
#livebox .livebox .livetitle a{color:#fff; text-decoration:underline; color:#add5e9; font-weight:700;}
#livebox .livebox h3{font-size:17px; font-size:1.7rem; font-weight:300;}
#livebox .livebox .eventname{font-weight:300;}
#livebox .livebox dl{margin:16px 0 30px; font-weight:300;}
#livebox .livebox dl dt{font-family: 'Kanit', sans-serif; font-weight:700; color:#add5e9;}
#livebox .livebox dl dd{margin-bottom:1em;}
#livebox .livebox dl dd p{margin-bottom:16px;}
#livebox .livebox dl dd .sml{margin-top:7px; font-size:13px; font-size:1.3rem;}

#livebox .livebox .btn a {position: relative; display: flex; justify-content: space-around; align-items: center; margin: 0; width:60vw; max-width: 240px; padding:8px 15px; color: #fff; transition: 0.3s ease-in-out; font-family: 'Kanit', sans-serif; font-weight:100; border:1px solid #fff; font-size:14px; font-size:1.4rem; text-decoration:none;}
#livebox .livebox .btn a:before {content: ''; position: absolute; top: calc(50% - 2px); right: -2em; transform: translateY(calc(-50% - 2px)) rotate(30deg); width: 12px; height: 1px; background-color: #fff; transition: 0.3s;}
#livebox .livebox .btn a:after {content: ''; position: absolute; top: 50%; right: -2em; transform: translateY(-50%); width: 60px; height: 1px; background-color: #fff; transition: 0.3s;}
#livebox .livebox .btn a:hover:before, #livebox .livebox .btn a:hover:after {right: -2.5em;}
#livebox .livebox .btn a:hover {background: #333;}


@media only screen and (min-width:740px) {
#livebox .livebox .date{display:inline-block; margin-right:8px;}
#livebox .livebox dl dt{clear:left; float:left; margin:0 0 1em; width:10em;}
#livebox .livebox dl dd{margin-bottom:1em; margin-left:11.5em;}
}