* {margin: 0; padding: 0; box-sizing: border-box; text-decoration: none; text-align: justify; font-family: arial; word-break: normal; }
/* hyphens: auto;  */
.acont { width: 100%; background: linear-gradient(45deg, #AEC6CF, #98FB98, #F5F5DC, #FFDAB9 ); }
/* breadcrumb  */
.ab { margin: 5px 0; }
.ab a { text-decoration: underline; display: inline-block; }
/* button  */
.abtna1, .abtnb1 { background-color: #4B0082; color: white; text-shadow: 2px 2px 5px black; border: none; padding: 5px 30px; text-align: center; text-decoration: none; display: inline-block; font-size: 16px;  border-radius: 8px; transition: background-color 0.3s ease, transform 0.2s ease; }
.amainc a:hover, .amainc button:hover { transform: scale(1.05); }
/* footer  */
.afoot { padding: 40px;  display: flex; flex-flow: row wrap; justify-content: space-between; gap: 10px; background-color: #004D40;  }
.afoot div { width: 250px; flex-grow: 1; border: 1px solid #C0C0C0; border-radius: 10px; box-shadow: 1px 1px 3px gray; padding: 25px 20px; display: flex; flex-flow: column nowrap; }
.afoot div h3 { color: white; margin-bottom: 45px; color: #C0C0C0;  }
.afoot div p { color: white; margin: 0 0 25px 0; color: #C0C0C0; }
.afoot div a { color: white; text-decoration: underline; display: block; margin-top: auto; color: #C0C0C0; }
.afoot div:nth-child(3) a { margin: 0 0 25px 0;}
.afoot div p span { text-align: center; display: block; color: yellow; } 
.afoota { padding: 20px 10px;  border-top: 1px solid white; background-color: #004D40; color: #C0C0C0;  text-align: center; }
/* 1st menu  */
.amenua0 .amenua1, .amenua3, .amenub0 .amenub1, .amenub3 {  display: none;}
.amenua0, .amenub0, .amenua3, .amenub3  { padding: 0 20px;  background: linear-gradient(#0D1B2A, #000) ; box-shadow: 2px 2px 5px black; }
.amenua0 a, .amenub0 a { color: white; padding: 5px 20px; display: inline-block; text-shadow: 5px 5px 5px black; }
.amenua3 a:hover, .amenub3 a:hover, .amenua0 a:hover, .amenub0 a:hover { border-radius: 5px; background-color: #DAA428; color: black; }
.amenua3 a, .amenub3 a { display: block; color: white; padding: 5px 20px; font-size: 12px;}
/* header  */
.aheada { display: flex; flex-flow: row wrap; justify-content: space-between; gap: 15px; align-items: center; padding: 15px 10px; }
.aheada img { width: 200px; border-radius: 10px; box-shadow: 1px 1px 5px black;}
/* header main  */
.aheadm { padding: 30px; display: flex; flex-flow: row nowrap; justify-content: space-between; align-items: center; gap: 20px; background: #4B0082; padding: 20px; }
.aheadm div { flex: 1 1 50%; }
.aheadm div h1 { font-size: 2.5em; color: #C0C0C0; text-shadow: 5px 5px 15px black; margin: 0;  }
.aheadm .aheadmd1 .aheadmp1 { font-size: 2rem; color: #DAA428; margin: 30px 0; }
.aheadm .aheadmd1 .aheadmp2  { background-color: rgba(255, 255, 255, 0.5); border-radius: 8px; box-shadow: 1px 1px 5px gray;  padding: 20px; width: 90%; }
.aheadm img  { width: 90%; display: block; border-radius: 10px; box-shadow: 3px 3px 5px white; margin: auto; }
/* main  */
.amain { display: flex; flex-flow: row wrap; justify-content: space-between; gap: min(10px, 1%); padding: min(15px, 1%); }
.amainl { width: 160px; }
.amainr { width: 300px; }
.amainc { flex: 1 1 600px; }
/* right  */
.amainrlad { margin: 0 0 30px 0; width: 100%; }
.amainrl div { margin: 0 0 30px 0; width: 100%; border: 1px solid gray; box-shadow: 2px 2px 4px gray; border-radius: 10px; padding: 20px; background-color: white; }
.amainrl div h3 { margin: 0 0 30px 0; }
.amainrl div input { margin: 0 0 30px 0; display: block; width: 100%; }
.amainrl div a { margin: 0 0 30px 0; display: inline-block; }
/* prev next post buttons */
.apn { display: flex; flex-flow: row wrap; justify-content: space-between; gap: 15px; margin: 50px 0 20px 0; }
/* common settings  */
.aul, .aul1, .apnote li {list-style: '◈';  }
.aul li a, .aul1 li a, p a, .apnote li a {text-decoration: underline;}
.apost .ah1 { text-align: center;  }
.apost .ah1, .ah2, .ah2a, .ah3, .ah4, .ah5, .ah6 { text-shadow: 2px 2px 4px gray; }
.apost .ah1, .ah2a, .ap1, .aul1, .aol1, .atable1 { margin-bottom: 80px;  }
.aul li, .aul1 li, .aol li, .aol1 li, .apnote li { padding: 0px 0px 0px 20px; margin: 0 0 0 50px;}
.ah2, .ah3, .ah4, .ah5, .ah6, .apost .ap, .aul, .aol, .atable, .amb { margin-bottom: 50px;}
/* .apnote { background-color: yellow; padding: 20px; margin: 0 0 30px 0; border: 1px solid gray; border-radius: 5px; box-shadow: 2px 2px 2px gray; } */
.ahr { margin: 50px 0;  border: none; height: 5px; background: linear-gradient(to right, red, yellow, green); }
/* sitemap  */
.asm0, .asm1 { margin: 0 0 5px 0; display: flex; flex-flow: row nowrap;  }
.asm0 { margin: 20px 0; }
.asm1 { padding: 0 0 0 40px; }
.asm0 span, .asm1 span { display: inline-block; }
.asm0 a, .asm1 a { padding: 0 0 0 20px; display: inline-block; text-decoration: underline; text-shadow: 0px 0px 3px gray; }
.asm0 a { font-weight: bold; }
/* post menu0  */
.apost { border: 1px solid gray; padding: 20px; border-radius: 20px; }
.apostm0  { display: flex; flex-flow: row wrap; justify-content: space-between; gap: 20px; }
.apostm0a { width: 250px; padding: 10px; border: 1px solid gray; box-shadow: 2px 2px 5px gray; flex-grow: 1;  display: flex; flex-flow: column nowrap; justify-content: space-between; background-color: white; border-radius: 10px;}
.apostm0a .aamh { height: 250px; display: flex; justify-content: center; align-items: center; text-align: center; color: white; font-size: 20px; font-weight: bold; text-shadow: 3px 3px 5px black; padding: 25px; border-radius: 10px; }
.apostm0a .aamp { margin: 15px 0; text-align: left; text-shadow: 1px 1px 1px gray; font-size: 18px;  }
.apostm0a a { text-decoration: underline; display: block; margin-bottom: 10px; margin-top: auto; text-align: left; }
/* post  */
.apost .aposth { padding: 50px 20px; text-align: center; font-size: 30px; font-weight: bold; margin: 0 0 40px 0; color: white; text-shadow: 3px 3px 6px black; border-radius: 10px; }
.apost .aphimg { width: 100%; margin: 0 0 30px 0; box-shadow: 2px 2px 10px black; border-radius: 10px; }
/* table  */
.atable, .atable1 { background:  #D2B48C; margin-inline: auto; }
/* .atable, .atable1 { background:  rgb(243, 216, 170); margin-inline: auto; } */
.atable, .atable1, :is(.atable, .atable1) :is(th, td, tr)  { border: 1px solid gray;  }
:is(.atable, .atable1) :is(th, td, th, td){ padding: 8px; text-align: left;  }
/* counter  */
.anor { counter-reset: section 0; }
.anoi::before { counter-increment: section; content: "" counter(section) ". "; }
/* faq  */
.adt { border: 1px solid gray; border-radius: 5px; padding: 5px 20px; margin: 0 0 20px 0;}
.adt summary{ font-weight: bold; margin: 10px 0;}
.adt p { margin: 0 0 20px 10px;}
/* colors  */
.abcd { background: linear-gradient(#0D1B2A, #000);}
.abcd0 { background: radial-gradient(circle at 97% 18%, rgb(37 106 229), rgb(181 11 70)); filter: hue-rotate(260deg); }
/* sbg  */
.asbg { 
    /* background: linear-gradient( 295deg, rgb(225 124 94), rgb(13 224 104)); */
    /* background: linear-gradient( 8deg, rgb(113 211 238), rgb(221 105 54)) ; */
    background: linear-gradient( 242deg, #87ef28, #c0cef8 );

     padding: 15px; margin: 0 0 30px 0; box-shadow: 2px 2px 5px gray; }  
.asbg div { display: flex; flex-flow: row wrap; justify-content: space-between; border: 1px solid gray; border-radius: 10px; } 
.asbg div .asbg1 { display: flex; flex-flow: column nowrap; justify-content: center; align-items: center; text-align: center; color: white; flex: 1 0 200px; padding: 20px; text-shadow: 1px 1px 2px gray; font-size: 18px; }  
.asbg div .asbg2 { flex: 1 1 500px; padding: 20px; } 


/* responsive - media query*/
/* @media screen and (min-width: 1350px) { .acont {width: 1350px; margin: 0 auto; } } */
@media screen and (max-width: 1350px) and (min-width: 930px) { .acont {width: 100%;} 
.aheada { flex-direction: column;  } .aheada1 { text-align: center; } .aheada img { margin: auto;  }
.amainc { order: 1; } .amainr { order: 2;} .amainl { order: 3;}   
.amain { justify-content: center; }
}
@media screen and (max-width: 930px) and (min-width: 10px) { .acont {width: 100%;} 
.aheada { flex-direction: column;  }  .aheada1 { text-align: center; } .aheada iframe { width: 100%;  } .aheada img { margin: auto; }
.aheadm { flex-direction: column; } .aheadm div { width: 100%;  } .aheadm .aheadmd2  { order: 1;  } .aheadm .aheadmd1  { order: 2;  }
.amainc { order: 1; } .amainr { order: 2;} .amainl { order: 3;} 
.amain { justify-content: center; } .apostm .amaincl { flex-direction: column; } .apostm .amaincl img, .apostm .amaincl div { width: 100%; }
.amenua .amenua0 .amenua1, .amenub .amenub0 .amenub1 { display: inline-block; } .amenua .amenua0 .amenua2, .amenub .amenub0 .amenub2 { display: none; }
}