@charset "utf-8";

/*************************************************************************************************************
	SHP Web CSS
*************************************************************************************************************/

/*************************************************************************************************************
	Font
*************************************************************************************************************/
@font-face {
  font-family:'Nanum Barun Gothic';
  font-style:normal;
  font-weight:normal;
  src:local('※');
  src:url(/webstatic/fonts/NanumBarunGothic.woff) format('woff');
}
@font-face {
  font-family:'Nanum Barun Gothic';
  font-style:normal;
  font-weight:bold;
  src:local('※');
  src:url(/webstatic/fonts/NanumBarunGothicBold.woff) format('woff');
}

/*************************************************************************************************************
	Setting
*************************************************************************************************************/
* {font-family:"Nanum Barun Gothic", sans-serif, arial; -webkit-text-size-adjust:none; -webkit-font-smoothing:antialiased;}
html,body {font-size:16px; -webkit-user-select:none; -webkit-tap-highlight-color:rgba(0,0,0,0);}
body,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,form,fieldset,p,button {margin:0; padding:0;}
em,address {font-style:normal;}
a,u {text-decoration:none;}
a,input,select,textarea,button {outline:none;}
img {display:block; overflow:hidden;}
img,button,input {border:0 none;}

/*************************************************************************************************************
	Layout
*************************************************************************************************************/
html,body {min-width:320px; background-color:#f3f0eb;}

/*************************************************************************************************************
	Page : Intro
*************************************************************************************************************/
img.shp-img-intro {display:block; width:100%; overflow:hidden;}

.shp-ui-web {display:block; position:relative; width:720px; margin:0 auto; overflow:hidden;}
.shp-ui-web .shp-ui-slogan {position:absolute; left:100px; bottom:40px;}
.shp-ui-web .shp-ui-slogan strong {display:block; margin-bottom:20px; font-size:24px; color:#585553;}
.shp-ui-web .shp-ui-slogan p {margin-top:10px; font-size:18px; color:#585553; overflow:hidden;}
.shp-ui-web .shp-ui-slogan p a {color:#585553;}

.shp-ui-mobile {display:none; overflow:hidden;}
.shp-ui-mobile .shp-ui-slogan {padding:20px 0 0 28px; background-color:#d8cfc6; overflow:hidden;}
.shp-ui-mobile .shp-ui-slogan strong {display:block; margin-bottom:9px; font-size:14px; color:#585553;}
.shp-ui-mobile .shp-ui-slogan p {margin:9px 0 0 0; font-size:11px; color:#585553; overflow:hidden;}
.shp-ui-mobile .shp-ui-slogan p a {color:#585553;}

/*************************************************************************************************************
	Responsive
*************************************************************************************************************/
@media only screen and (max-width:414px){
	html,body {background-color:#d8cfc6;}
	.shp-ui-web {display:none;}
	.shp-ui-mobile {display:block;}
	.shp-ui-mobile .shp-ui-slogan {padding-bottom:20px;}
}
