@charset "utf-8";
/* CSS Document */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {margin: 0;padding: 0;border: 0;font-size: 100%;font: inherit;vertical-align: baseline;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;}
body { font-family: 'interregular'; width:100%; height:100%; background: #110e05;}
ul {list-style: none;}
*{ margin:0; padding:0;}
a{ text-decoration:none; outline:none;}
h6,h5,h4,h3,h2,h1{ margin:0; font-family: 'aeonikbold'; font-weight:normal;}
img{ border:none;}
div{display:flow-root; box-sizing: border-box;}
.clear{ clear:both;}
.container{position:relative; margin:0 auto; width:1200px; display: flex; flex-direction: column; color: var(--text-color);}
:root{--text-color:#e5dbbd; --default-fontsize:16px; --heading-color:#f7e5ad;}


/*------Header Section-------*/
header{border-bottom: #4e351d solid thin; padding-bottom: 36px; margin-bottom: 45px;}
header .container{ display:flex; align-items: center; justify-content: center; flex-direction: column; }
#logo{ width:167px; height:171px;  margin:19px 0;}
#logo img{ width: 100%; height: 100%;}
header h1{ font-size: 37px; color: var(--heading-color); text-transform: uppercase;}
/*------Header Section End-----*/


/*content part*/
#welcome .container {display: flex; flex-direction: column; color: var(--text-color); line-height: 28px; font-size: var(--default-fontsize); text-align: center;}
#vision .container{ display: flex; flex-direction: row;}
#welcome .container h2{ font-size: 27px; margin: 30px 0; color: var(--heading-color);}
#vision{ background: #1a1401; color: var(--text-color); padding: 30px 0; margin: 80px 0;}
#vision h2{ font-size: 27px; margin-bottom: 14px; color: var(--heading-color);}
#vision i{ font-size: 55px; margin: 0 28px 0 0;}
.head{ font-size: 26px; margin: 0 0 20px 0; color: var(--heading-color);}
.key li{ list-style-position: inside; line-height: 31px;}
.key strong{ font-size: 16px;}
.contents{ margin: 50px 0; line-height: 28px;}
.contents h1{ font-size: 32px; margin: 37px 0 68px 0; color: var(--heading-color);}
.join{ font-size: 25px; line-height: 62px; color: var(--text-color);}
#contract{ background: #e7c475; border-radius: 15px; display: flex; justify-content: center; align-items: center; padding: 24px 30px; color: #000000; width: 320px; box-sizing: border-box; margin: 58px 0 0 0;}
#contract i{ margin-left: 14px;}
#contract:hover{ background: #c7a456;}
#contractshow{ width: 650px!important; padding: 30px; box-sizing: border-box; background: #000000; color:#9d9d9d; border: #282114 solid thin; padding-top: 60px; display: flex; flex-direction: column; text-align: center;}
#contractshow div{ border: #282114 solid thin; padding:30px; margin-bottom: 30px;}
#contractshow div span{ margin: 20px 0 0 0; font-size: 20px; display: block; color: var(--text-color); word-wrap: break-word;}
#contractshow a{ text-decoration: underline; color: var(--text-color);  margin-top: 15px;}
#contractshow a:hover{ text-decoration: none;}
#contractshow button{ background:#bfa66d; padding: 10px 18px; font-family: 'interregular'; font-size: 14px; outline:none; margin: 20px 0 0 0; border-radius: 6px; border: none;}
#contractshow button:focus{ background-color: #7c6633;}
/*content part end*/

/*innerpage content*/

/*innerpage content end*/

/*footer section*/
footer{ background:#1e1700; padding:38px 0; margin: 60px 0 0 0;   color:var(--text-color);}
footer .container{ display: flex; flex-direction: row; justify-content: space-between;}
#social-top{ display: flex; flex-direction: row;}
#social-top a{ color: var(--footer-textcolor); font-size: 15px; margin: 0 15px;}
#social-top a:hover{color:#c7a456;}
#copyrt{font-size:14px;}

/*footer section end*/

@media (max-width:1200px){
.container{ width:992px;}
}

@media (max-width:992px){
.container{ width:768px;}
}

@media (max-width:768px){
.container{ width:448px;}
.key li, .join{ line-height: 31px; margin-bottom: 20px;}
#vision{ line-height: 28px;}
#social-top a{ margin: 0 7px;}
}



@media (max-width:448px){
.container{ width:300px;}
#welcome .container{ text-align:left;}
header h1{ font-size: 27px;}
.key li{ line-height:28px;}
#contract{ width: 100%; padding: 24px 0;}
footer .container{ flex-direction: column;}
#copyrt{ margin-bottom: 20px;}
}