@charset "utf-8";

.mainframe				{ background-repeat:no-repeat; width:100%; background-position:center top;
                          background-image:url("/images/photo/2020/Yangdok/back.jpg"); padding-bottom:100px; background-size:cover; height:500px; }
.mf-title               { text-align:center; margin-top:0px; padding-top:100px; color:red; font-size:36px; font-weight:bold;
                          padding-bottom:50px; text-shadow:2px 2px white; background-size:cover; }
.photoframe				{ background-repeat:no-repeat; width:100%; background-position:center top;
                          background-image:url("/images/photo/2020/Yangdok/back_1.jpg"); }
.mf-article             { clear:both; width:80%; margin:0 auto; padding:50px 0px 0px 0px;}
.mf-article p           { font-size:15px; font-family:"Times New Roman"; margin-left:50px; margin-right:50px; color:black; }
.mf-article p a			{ font-size:15px; font-family:"Times New Roman"; color:blue;  }  
.container-fluid		{ margin-top:60px; width:80%!important;}
.btn-photo				{ float:right; margin-right:calc(10% + 10px); width:auto; padding:5px; border-radius:5px; cursor:pointer; }

.sb-title				{ text-align:center; margin-top:0px; padding-top:10px; color:red; font-size:36px; font-weight:bold;
                          padding-bottom:10px; text-shadow:2px 2px white; }
.gallery				{ text-align:center; }
.photo-delta			{ width:100%; margin:10px; height:300px; background-position:center center;
                          background-size:cover; cursor:pointer; }
.overlay-effect         { width:calc(100% + 10px)!important; }
.photo-one				{ width:200px; margin:10px; height:200px; background-position:center center; float:left; 
                          background-size:cover; cursor:pointer; }
.photo-one:hover        { opacity:0.7; }
.single-portfolio-slide { cursor:pointer; }
.overlay-effect h4      { font-family:"WKGothic", "WKLGothic", "Batang"; text-align:center; margin-top:50%; }

#scrollUp				{  padding-top:7px; }

@media (max-width:640px){
    .mainframe          { padding-bottom:50px; }
    .mf-title           { font-size:30px; padding-top:50px; }
    .sb-title           { font-size:30px; }
    .mf-article         { padding:20px 0px 20px 0px; width:90%; }
    .container-fluid    { width:90%!important; }
    .mf-article p       { margin-left:20px; margin-right:20px; }
}

@media (max-width:480px){
    .mainframe          { padding-bottom:30px; }
    .mf-title           { font-size:30px; padding-top:50px; }
    .sb-title           { font-size:30px; }
    .mf-article         { padding:20px 0px 20px 0px; width:98%; }
    .container-fluid    { width:98%!important; }
    .mf-article p       { margin-left:10px; margin-right:10px; }
}