/* CSS Reset *//**********************************************************/

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td {
margin:0;
padding:0;
}
table {
border-collapse:collapse;
border-spacing:0;
}
fieldset,img {
border:0;
}
address,caption,cite,code,dfn,em,strong,th,var {
font-style:normal;
font-weight:normal;
}
ol,ul {
list-style:none;
}
caption,th {
text-align:left;
}
h1,h2,h3,h4,h5,h6 {
font-size:100%;
font-weight:normal;
}
q:before,q:after {
content:'';
}
abbr,acronym { border:0;
}
img{vertical-align:text-bottom}

/* Global *//**********************************************************/
html {scroll-behavior: smooth;}
body { margin: 0px; padding: 0px; font-size:16px; position:relative; color:#333; font-family:"Trebuchet MS","Microsoft JhengHei","\5FAE\x8EDF\6B63\9ED1\9AD4","Microsoft Yahei","\5FAE\8F6F\96C5\9ED1", Verdana, Calibri, Helvetica, Arial, sans-serif; background-color:#EEE;/*-webkit-font-smoothing: subpixel-antialiased;*/ background-image: url("../images/bg_temp.jpg"); background-position: center; background-size: cover; background-repeat: no-repeat; background-attachment: fixed}
a{ color:#444; text-decoration:none}
.clear{	clear:both;}
.siteArea{ width: 100%; margin: 0 auto;}
@media only screen and (min-width: 1400px) {
    .siteArea{ width: 76% }
}

.footer{ background-color: #3A3A3A; padding: 10px 20px;line-height: 22px; color: #fff;  display:grid; grid-template-columns:repeat(2,1fr);font-size: 13px}
.footer a{color: #fff; text-decoration: underline; }
.irasiaLogo{ text-align: right}
.irasiaLogo img{ height: 13px; vertical-align: baseline}
.tnc { display: block; margin-left: 0}
@media only screen and (max-width: 768px) {
    .footer{grid-template-columns:repeat(1,1fr); padding: 24px 20px;}
    .copyright,.irasiaLogo{ text-align:left}
    .copyright{ padding-bottom: 20px}
}

/* Notice *//**********************************************************/
.noticeContainer{ position: relative;}
.noticeContainer img{ width: 100%}
@media only screen and (orientation: landscape) {
    .noticeContainer .landscapeImg{display: block}
    .noticeContainer .portraitImg{display: none}
}
@media only screen and (orientation: portrait) {
    .noticeContainer .landscapeImg{display: none}
    .noticeContainer .portraitImg{display: block}
}

.note{ background-color: #999; color: #fff; font-size: 12px; box-sizing: border-box; padding: 20px;}
.note p{ line-height: 16px; margin-bottom: 10px;}
.note a{ color: #fff; text-decoration: underline}