/* Set
================================================= */

#set-mainttl { position:relative; width:100%; height:0; padding-top:17.142857142%; }
#set-mainttl h1 { position:absolute; display:block; left:0; top:0; width:100%; height:100%; background-position:center center; background-repeat:no-repeat; background-size:cover; background-image:url(../img/set/main_ttl.jpg); text-indent:-9999px; }

#set #main { padding:20px 50px 40px 50px; background:url(../img/set/set_bg.jpg); }

#set-subttl-box { margin-bottom:20px; border:#2c9120 5px solid; padding:10px; background:url(../img/set/set_subttl_bg.png) #2c9120; }
#set-subttl { font-size:170%; line-height:140%; color:#fff; }
#set-subttl-vol { display:inline-block; position:relative; top:-0.2em; padding:0.2em 0.2em 0.15em 0.2em; margin-right:0.5em; background-color:#fedf32; color:#2c9120; font-size:80%; line-height:100%; font-family:'Poppins', sans-serif; }

.set-txt-intro { margin-bottom:20px; font-size:120%; line-height:180%; font-weight:bold; color:#2c9120; text-align:center; }
.set-txt { margin-bottom:20px; font-size:120%; line-height:180%; text-align:center; }
.set-txt .marker { background:linear-gradient(transparent 70%, #fedf32 30%); }

.set-p { text-align:center; margin-bottom:5px; }
.set-p ul { /* for space */ font-size:0; }
.set-p ul li { margin:0 auto 10px auto; padding:0 7px; box-sizing:border-box; display:inline-block; margin-right:5px; vertical-align:top; /* for space */ font-size:1rem; }
.set-p ul li p { position:relative; width:100%; height:0; background-color:#fff; }
.set-p ul li p span { position:absolute; display:block; left:0; top:0; width:100%; height:100%; border:#fff 5px solid; box-sizing:border-box; box-shadow:2px 2px 4px rgba(0,0,0,0.2); background-position:center center; background-repeat:no-repeat; background-size:cover; text-indent:-9999px; }

#set-bknm { text-align:center; margin-top:10px; padding:10px; border:#ddd 5px solid; }
#set-bknm h2 { display:inline-block; vertical-align:middle; font-family:'Poppins', sans-serif; font-weight:normal; font-size:130%; }
#set-bknm ul { display:inline-block; vertical-align:middle; /* for space */ font-size:0; }
#set-bknm ul li { display:inline-block; width:4.5em; margin:5px; vertical-align:middle; /* for space */ font-size:1rem; }
#set-bknm ul li a { display:block; width:100%; padding:0.6em 0em 0.4em 0em; box-sizing:border-box; border-radius:1.0em; background-color:#3a9e2e; color:#fede32; text-decoration:none; font-family:'Poppins', sans-serif; font-size:110%; }
@media (hover: hover) { #set-bknm ul li a:hover { opacity:0.7; } }

/* ----- Media Queries ----- */

@media all and (max-width: 767px) {

#set-mainttl { position:relative; width:100%; height:0; padding-top:22.7%; }
#set-mainttl h1 { background-image:url(../img/set/main_ttl_smp.jpg); }

#set #main { padding:10px; }

#set-subttl { font-size:110%; }

.set-txt-intro { margin-bottom:10px; font-size:100%; line-height:140%; }
.set-txt { margin-bottom:10px; font-size:100%; line-height:140%; }

.set-p { margin-bottom:0; }

#set-bknm { padding:7px 3px; }
#set-bknm h2 {font-size:110%; margin-bottom:5px; display:block; }
#set-bknm ul li { margin:3px; }
#set-bknm ul li a { font-size:90%; }

}