@charset "utf-8";
#container{max-width: 100%;}
#container_title{max-width: 1200px;}

.sub{font-size: 16px;}
.sub .sec p{word-break: keep-all}

@media screen and (max-width: 1200px) {
   .sub{font-size: 14px;}
}

/* assoc_greeting */
.sub_assoc_greeting .sec1 img{display: block;margin: 0 auto;width: 95%;max-width: 500px;}
.sub_assoc_greeting .sec2 h2{font-size: 48px;text-align: center;}
.sub_assoc_greeting .sec2 p{text-align: center;margin: 20px 0;}
.sub_assoc_greeting .sec3{background: #00000099 url(../theme/basic/img/assoc_greeting_sec3.jpg) no-repeat center;background-attachment: fixed; padding: 50px 0;background-blend-mode: color;background-size: cover;}
.sub_assoc_greeting .sec3 p{font-weight: bold;text-align: center;font-size: 1.4em;color: #fff;}

@media screen and (max-width: 1200px) {
   .sub_assoc_greeting .sec2 h2{font-size: 18px;}
   .sub_assoc_greeting .sec3 p{font-size: 16px;}
}

/* assoc_logo */
.sub_assoc_logo{margin-bottom: 50px;}
.sub_assoc_logo .sec1 .inner{display: flex;flex-direction: row;justify-content:center}

.sub_assoc_logo .sec1 img{width: 30%;}
.sub_assoc_logo .sec1 p{width: 45%;padding: 50px;align-self: center;}

@media screen and (max-width:1200px) {
   .sub_assoc_logo .sec1 .inner{display: block;text-align: center;}
   .sub_assoc_logo .sec1 img{width: 90%;max-width: 300px;margin: 0 auto;}
   .sub_assoc_logo .sec1 p{text-align: center;width: 100%;}
}


/* assoc_organization */

.sub_assoc_organization .sec1{padding: 50px 0;background: #000;}
.sub_assoc_organization .sec1 h1{font-size: 24px;text-align: center;width: fit-content;margin: 0 auto;color: #fff;word-break: keep-all;}

.sub_assoc_organization .sec h3{font-weight: bold;padding-left: 8px;border-left: 4px solid #838457;font-size: 18px;margin-bottom: 4px;}
.sub_assoc_organization .sec dl{display: flex;flex-direction: row;justify-content: flex-start;flex-wrap: wrap;padding: 0 9px;}
.sub_assoc_organization .sec dl dt{font-weight: bold;margin-right: 6px;}
.sub_assoc_organization .sec dl dd{margin-right: 6px;}

.sub_assoc_organization .sec3, .sub_assoc_organization .sec5, .sub_assoc_organization .sec7{background: #efefef;padding: 50px 0;}

.sub_assoc_organization .sec8{margin-bottom: 50px;}


/* assoc_commanders */
.sub_assoc_commanders .sec1 h1{font-size: 24px;text-align: center;}
.sub_assoc_commanders .sec2{margin-bottom: 50px;}
.sub_assoc_commanders .sec2 .inner{display: flex;flex-direction: row;justify-content: space-around;flex-wrap: wrap;}
.sub_assoc_commanders .sec2 dl{width: 45%;display: flex;flex-direction: row;}
.sub_assoc_commanders .sec2 dl dt{margin-right: 6px;font-weight: bold;padding: 6px;border-bottom: 1px solid #bbb;width: 30%;word-break: keep-all;}
.sub_assoc_commanders .sec2 dl dd{padding: 6px;border-bottom: 1px solid #bbb;width: 70%;}

@media screen and (max-width: 1200px) {
   .sub_assoc_commanders .sec1 h1{font-size: 18px;}
   .sub_assoc_commanders .sec2 dl{width: 100%;}
}

/* assoc_rules */
.sub_assoc_rules{margin-bottom: 30px;}
.sub_assoc_rules .sec1 h1{font-size: 24px;text-align: center;margin-bottom: 30px;}

/* assoc_history */
.sub_assoc_history .sec2{padding: 50px 0;background: #efefef;}
.sub_assoc_history .sec2 h2{font-size: 18px;margin-bottom: 20px;text-align: center;}
.sub_assoc_history .sec2 ul li{padding-left: 16px;position: relative;}
.sub_assoc_history .sec2 ul li:after{position: absolute;content: '-';left: 0;top: 4px;word-break: keep-all;}
.sub_assoc_history .sec1 dl{display: flex;flex-direction: row;justify-content: flex-start;flex-wrap: wrap;}
.sub_assoc_history .sec1 dl dt{width: 30%;font-weight: bold;font-size: 24px;text-align: center;align-self: center;}
.sub_assoc_history .sec1 dl dd{width: 70%;margin-bottom: 15px;padding-bottom: 15px;border-bottom: 1px solid #999;padding: 20px;}

@media screen and (max-width: 1200px) {
   .sub_assoc_history .sec1 dl dt{width: 100%;}
   .sub_assoc_history .sec1 dl dd{width: 100%;}
}

/* assoc_intro */

@font-face {
    font-family: 'MiryangHaelmalgeunSangsang';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2206-02@1.0/MYHaemalgeunSangsang.woff2') format('woff2');
    font-weight: normal;
    font-display: swap;
}

.sub_assoc_intro .sec1 h1{font-size: 24px;text-align: center;margin-bottom: 30px;}
.sub_assoc_intro .sec1 p{word-break: keep-all;line-height: 1.8;}
.sub_assoc_intro .sec1 h5{text-align: right;}
.sub_assoc_intro .sec1 h6{text-align: right;font-family: 'MiryangHaelmalgeunSangsang';margin-bottom: 30px;font-size: 22px;}


/* donation */
.sub_donation .sec1{margin-bottom: 30px;}
.sub_donation .sec1 h1{font-size: 24px;text-align: center;margin-bottom: 30px;}
.sub_donation .sec1 h3 {margin-bottom: 15px;font-size: 1.2em;}
.sub_donation .sec1 h3 img{width: 30px;}

.sub_donation .sec1 .account{padding: 20px;max-width: 500px;background: linear-gradient(140deg, #838457, #000);border-radius: 12px;color: #fff;margin: 0 auto;cursor:pointer; position:relative;}

.sub_donation .sec1 .copy-toast{
  position:absolute;
  left:50%;
  top:100%;
  transform:translateX(-50%);
  width: 100%;
  margin-top:10px;
  background:rgba(0,0,0,.85);
  color:#fff;
  padding:10px 14px;
  border-radius:8px;
  font-size:14px;
  z-index:9999;
  word-break: keep-all;
  white-space: normal;
}
.sub_donation .sec1 .account > img{display: block;margin-left: auto;}
.sub_donation .sec1 .account p{font-weight: bold;text-align: right;font-size: 1.4em;}

@media screen and (max-width: 1200px) {
   .sub_assoc_history .sec1 dl dt{width: 100%;}
   .sub_assoc_history .sec1 dl dd{width: 100%;}
}

/* memory */
.sub_memory .sec1 {background: url(../theme/basic/img/sec6_bg.jpg) no-repeat center;background-size: cover;position: relative;height: 350px;display: flex;flex-direction: column;justify-content: center;}
.sub_memory .sec1 h1{color: #fff;text-align: center;font-size: 24px;}
.sub_memory .sec1 img{position: absolute;top: 0;left: 0;height: 100%;}

.sub_memory .sec2{background: #000;padding: 50px 0;}
.sub_memory .sec2 iframe{height: 35vw;margin: 0 auto;display: block;}
.sub_memory .sec2 h2{padding: 30px;color: #fff;text-align: center;}
.sub_memory .sec2 ul{display: flex;flex-direction: row;justify-content: flex-start;flex-wrap: wrap;max-width: 80%;margin: 0 auto;}

.sub_memory .sec2 ul li{padding: 30px;color: #fff;}
.sub_memory .sec8{background: url(../theme/basic/img/memory.jpg) no-repeat center;background-size: cover;padding: 50px;min-height: 400px;}
.sub_memory .sec8 h1{font-size: 1.4em;margin-bottom: 30px;}
.sub_memory .sec8 .content{background: #fff;padding: 30px;border-radius: 12px;}
.sub_memory .sec8 .content h5{font-weight: bold;font-size: 1.4em;margin-bottom: 20px;}
.sub_memory .sec8 .content .fig_wrap{display: flex;flex-direction: row;justify-content: flex-start;flex-wrap: wrap;}
.sub_memory .sec8 .content .fig_wrap figure{margin: 1%;width: 23%;display: flex;flex-direction: column;justify-content: center;}
.sub_memory .sec8 .content .fig_wrap figure figcaption{text-align: center;}
.sub_memory .sec8 .content .fig_wrap figure img{width: 150px;height: 150px;object-fit: cover;display: block;margin: 0 auto;border-radius: 50%;}

@media screen and (max-width: 1200px) {
   .sub_memory .sec1 img{opacity: 0.4;}
  .sub_memory .sec2 ul li{padding:12px}
  .sub_memory .sec2 h2{word-break: keep-all;}

   .sub_memory .sec8{padding: 12px;}
  .sub_memory .sec8 .content .fig_wrap figure{width: 48%;}
  .sub_memory .sec8 .content .fig_wrap figure img{width: 80px;height: 80px;}
}