@charset "UTF-8";

@-ms-viewport{width:device-width;}

@-o-viewport{width:device-width;}

@-moz-viewport{width:device-width;}

@-webkit-viewport{width:device-width;}

@viewport{width:device-width;}

@font-face {

				  font-family: 'Noto Sans KR';

				  font-style: normal;

				  font-weight: 400;

				  src: url('./fonts/noto-sans-kr-v12-latin_korean-regular.eot'); /* IE9 Compat Modes */

				  src: local('Noto Sans KR Regular'), local('NotoSansKR-Regular'),

					   url('./fonts/noto-sans-kr-v12-latin_korean-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */

					   url('./fonts/noto-sans-kr-v12-latin_korean-regular.woff2') format('woff2'), /* Super Modern Browsers */

					   url('./fonts/noto-sans-kr-v12-latin_korean-regular.woff') format('woff'), /* Modern Browsers */

					   url('./fonts/noto-sans-kr-v12-latin_korean-regular.ttf') format('truetype'), /* Safari, Android, iOS */

					   url('./fonts/noto-sans-kr-v12-latin_korean-regular.svg#NotoSansKR') format('svg'); /* Legacy iOS */

				}

body { background:#fff;font-family:"Noto Sans KR", sans-serif;font-size:15px;color:black;line-height:100%;font-weight:normal;padding:0px;margin:0px;letter-spacing:-0px; }

html, body { width:100%;height:100%;letter-spacing:0px; }

div, p, ul, li, table, th, td, textarea, input, span, form, h1, h2, h3, h4, h5, h6, dt, dl, dd, em, sup {padding:0px;margin:0px;}

ul, ol, dl, dd, dt, li { list-style-type:none;margin:0;padding:0px;line-height:100%;font-size:12px;color:#5b5b5b;letter-spacing:0px; }

form, fieldset, p {margin:0;padding:0;border:0;}

img {border:0;vertical-align:middle;outline:none;}

 

 

a,a:link,a:visited,a:active{color:black;letter-spacing:normal;text-decoration:none;letter-spacing:-0.8px;}

a:hover{color:#575757;}

	 *{margin:0;padding:0;}

	li{list-style:none;}

	 .clearfix::after{content:"";display:block;clear:both;}
.text-fs-12{
    font-size:12px;
}
 
article p{
    padding-bottom:1em;
}
	 #wrap{width:750px;

		  margin:0 auto;}

	#back_text{width:300px;

			  height:100vh;

			 line-height:20px;}

	#back_text_3{width:300px;

			  height:1100px;

			 line-height:20px;}

	#mobile{width:400px;

			height:800px;

		   background-color:#eda340;

		   position:relative;

		   }

	

	#back_text,#mobile{float:left;}

	#back_text,#mobile_3{float:left;}

	#back_text_3,#mobile_3{float:left;}

	.img_box{width:100%;

			 height:200px;

			 /* background-color:red; */

			 margin-top:30px;}

	.img_box > img{width:130px;

				   position:absolute;

				   left:50%;

				   margin-left:-65px;}

	.text_box{width:100%;

			  height:300px;

			  text-align:center;

			  font-weight:500;

			  line-height:21px;

			  position:absolute;

			  top:170px;
			  
			  font-size:14px;}
			  
	.text_box2{width:100%;

			  height:300px;

			  text-align:center;

			  font-weight:500;

			  line-height:23px;

			  position:absolute;

			  top:270px;
			  
			  font-size:14px;}
    .text-div{
    	height:100%;

      text-align:center;

      font-weight:300;

      line-height:19px;

      position:absolute;

    top: 510px;

      font-size:12px;
        padding-left: 0px;
        padding-right: 0px;
        margin-top:20px;
    }
    .text-div p{
        width: calc(100% - 20px);
        padding-left: 10px;
        padding-right: 10px;
        text-align: left;
        float:left;
        padding-bottom: 3px;
    }
    .text-div p.center{
        text-align: center;
        font-weight: bolder;
    }
    .text-div img{
        width: 50px;
        margin-top: 75px;
    }
	footer {
            position: absolute;

			text-align:center;

			font-weight:800;
            }
    .menu, .menu_name{
        padding-left:5px;
    }

/* 2번째 앱오픈전 전화번호 수집 */

	#phone{
        width: calc(100% - 50px);
        padding: 0px 25px;
        position: absolute;
        top: 430px;
        text-align: center;
    }

    #phone .checkboxLabel{
        display: inline;
        padding-left: 15px;
        text-indent: -15px;
    }
    #phone input[type=checkbox]{
      width: 15px;
      height: 15px;
      padding: 0;
      margin:0;
      vertical-align: bottom;
      position: relative;
      top: -1px;
      *overflow: hidden;
    }
    #phone .privacy-div{
        margin-top:12px;
    }
	#phoneNum{
	          border : 0px;

  			  border-radius:5px;

			  box-shadow: none;

			  background:white;

			  width:250px;

			  height:45px;

                float: inherit;

			  font-size:14px;

			  font-weight:800;

			  text-align:center;}

	button{width:90px;

		   height:45px;

            margin-left:5px;
	       background-color:black;

	       border-radius:5px;

	       border:2px solid black;

	       font-size:14px;

	       color:white;

	       z-index:99;}

	 button:hover{background-color:#F58331;

			     color:#fff;}

 

	.img_box_2{width:100%;

			 height:200px;

			 /* background-color:red; */

			 margin-top:50px;}

	.img_box_2 > img{width:120px;

				   position:absolute;

				   left:50%;

				   margin-left:-60px;}

	.text_box_2{width:100%;

			  height:300px;

			  text-align:center;

			  line-height:23px;

			  position:absolute;

			  top:180px;

			  /* background-color:green; */
			  
			  font-size:14px;}

	.app_store{width:100%;

			   height:200px;

			   position:absolute;

			   top:550px;}

	.app_store > a{width:120px;

					 position:absolute;

				     left:50%;

				     margin-left:-60px;}

/* 앱 오픈 후 식당페이지 */

    #back_text_3{font-size:14px;

				/* line-height:20px; */

				/* background-color:red; */}

	#mobile_3{
	        width:400px;

			height:1100px;

		   position:relative;}

	header{width:100%;

			height:50px;

			text-align:center;

			background-color:#eda340;}

	#top_text{width:100%;

			  height:20px;

			  /* background-color:red; */

			  margin-top:15px;

			  display:inline-block;

			  font-size:20px;

			  font-weight:800;}

	#id_wrap{width:100%;

			height:50px;

            background: white;}

	#profile,#store{float:left;}

 

	#profile{width:55px;

			height:50px;

			/* background-color:#ddd; */

			text-align:center;}

	#profile img{width:40px;

				 height:40px;

				 margin:0 auto;

				 margin-top:5px;}

	#store{font-size:16px;

		   font-weight:800;

		   line-height:50px;}

	.main_slick img{width:420px;

			    height:360px;}

	section{width:100%;

			/* height:800px; */

			/* background-color:yellow; */

			position:relative;}

	.id_text{width:400px;

			 height:30px;

			font-weight:800;

			margin-top: -18px;

			/* background-color:pink; */}

 

	hr{width:100%;

	   height:1.5px;

	   background-color:#e6e4db;

	   border:0;

	   margin-top:20px;

	   margin-left:0;

	   margin-bottom:20px;}

 

 

	.sub_title{padding:10px 5px;}

 

 

	article{width:400px;

            margin: 0px auto;

			font-size:14px;

			line-height:20px;}

	

 

	.info{width:400px;

		  /* background-color:orange; */

		  height:100%;

          margin: 0px;

          display: inline-block;

          padding-top : 2px;

          padding-bottom : 2px;

          padding-left: 5px;
          }

	.info_text{width:350px; line-height: 1.5;}

	.info_text,.icon{float:left;}

	.icon{width:20px;

		  /* background-color:red; */}

	.icon img{width:15px;}

	

	.menu{height:30px;}

	.price{margin-left:5px;}



 

 /* ipad pro */

 @media all and (min-width:1024px) and (max-width:1367px){


    #back_text_3{
            height:100vh;
            display:none;
    }

 /* 앱 오픈전 -푸딘코 홈페이지 메인 */

	#back_text{display:none;}

	#mobile{height:100vh;

			width:100%;}

	#wrap{width:100%;}

	.img_box img{width:120px;

				 position:absolute;

				 left:50%;

				 margin-left:-60px;}

	.text_box{width:600px;

			  height:300px;

			  text-align:center;

			  /* background-color:green; */

			  font-weight:300;

			  font-size:21px;

			  line-height:25px;

			  position:absolute;

			  top:170px;

			  left:50%;

			  margin-left:-300px;}
    .text-div{
        width:100%;
        top: 590px;
    }
    .text-div p.center{
        font-size: 15px;
    }
    .text-div img{
        margin-top: 55px;
    }
	 footer{font-size:21px;}


/* 앱오픈전 전화번호 수집 */

	.img_box_2 img{width:200px;

				 position:absolute;

				 left:50%;

				 margin-left:-100px;

				 margin-top:50px;}

	.text_box_2{width:600px;

			  height:300px;

			  text-align:center;

			  /* background-color:green; */

			  font-weight:800;

			  font-size:21px;

			  line-height:25px;

			  position:absolute;

			  top:300px;

			  left:50%;

			  margin-left:-300px;}

    #phone{
        width: calc(100% - 660px);
        padding: 0px 330px;
        top:500px;}

	#phoneNum{
			  width:250px;
			  }

	button{width:90px;

		   height:45px;}

	 button:hover{background-color:#F58331;

			     color:#fff;}

 

	.app_store{width:100%;

			   height:200px;

			   position:absolute;

			   top:700px;}

	.app_store > a{width:120px;

					 position:absolute;

				     left:50%;

				     margin-left:-60px;}

 

 }

 

/* ipad */ 

 @media all and (min-width:764px) and (max-width:1023px){
    #back_text_3{
            height:100vh;
            display:none;
    }
	#back_text{height:100vh;

				display:none;}

	#wrap{width:100%;

		  margin:0 auto;

	     /*  height:800px; */}

	#mobile{height:100vh;

			width:100%;}

    #phone{
        width: calc(100% - 420px);
        padding: 0px 210px;
    }
	.img_box{margin-top:30px;}

	.img_box img{width:120px;

				 position:absolute;

				 left:50%;

				 margin-left:-60px;}


	.text_box{width:410px;

			  height:300px;

			  text-align:center;

			  /* background-color:green; */

			  font-weight:800;

			  font-size:14px;

			  line-height:25px;

			  position:absolute;

			  top:150px;

			  left:50%;

			  margin-left:-205px;}

}

 

 

/* 아이폰 x */

@media screen and (min-width: 375px) and (max-width:413px){

#wrap {
    width: 100%;
    margin: 0 auto;
}
#back_text_3{
        height:100vh;
        display:none;
}
#back_text{display:none;}

#mobile{width:100%;}

.text_box{

      font-size:13px;

      line-height:22px;
}

 

 

.img_box{margin-top:30px;}

.img_box img{width:120px;

			 position:absolute;

			 left:50%;

			 margin-left:-60px;}

 

/* 앱 오픈 전 전화번호 수집 */

.text_box_2{width:350px;

			  height:300px;

			  text-align:center;

			  /* background-color:green; */

			  font-weight:800;

			  font-size:13px;

			  line-height:25px;

			  position:absolute;

			  top:180px;

			  left:50%;

			  margin-left:-175px;}

.img_box_2 > img {

    width: 110px;

    position: absolute;

    left: 50%;

    margin-left: -55px;}

 

#phone{
    width: calc(100% - 50px);
    padding: 0px 25px;
		   top:430px;}

#phoneNum{
			  width:210px;

			  height:30px;}

	button{width:60px;

		   height:30px;

	       margin-top:0px;}

	 button:hover{background-color:#F58331;

			     color:#fff;}

 

	.app_store{width:100%;

			   height:200px;

			   position:absolute;

			   top:550px;}

	.app_store > a{width:120px;

					 position:absolute;

				     left:50%;

				     margin-left:-60px;}

 

footer{font-size:13px;}



}

 

/* 아이폰 6/7/8 */

 @media screen and (min-width: 375px) and (max-width:812px){

    #back_text_3{
            height:100vh;
            display:none;
    }

	#back_text{display:none;}

	#mobile{width:100%;

			height:120vh;}

	#wrap{width:100%;

		  margin:0 auto;}
	.text_box {
			    top: 150px;
			}	  
	.text_box2 {
			    width: 100%;
			    height: 300px;
			    text-align: center;
			    font-weight: 500;
			    line-height: 23px;
			    position: absolute;
			    top: 320px;
			    font-size: 13px;
				}
    .text-div{
        width: calc(100% - 10px);
        top: 510px;
        padding-left: 10px;
        margin-top:30px;
    }

    .text-div p {
        padding-left: 5px;
        padding-right: 5px;
    }
	/* 앱 오픈 전 전화번호 수집 */

.text_box_2{width:350px;

			  height:300px;

			  text-align:center;

			  /* background-color:green; */

			  font-weight:800;

			  font-size:13px;

			  line-height:25px;

			  position:absolute;

			  top:170px;

			  left:50%;

			  margin-left:-175px;}

.img_box_2 > img {

    width: 110px;

    position: absolute;

    left: 50%;

    margin-left: -55px;}

 

#phone{
		   top:440px;}

#phoneNum{
		  width:220px;

		  height:35px;}

	button{width:90px;
		  height:35px;
	       margin-top:0px;}

	 button:hover{background-color:#F58331;

			     color:#fff;}

 

	.app_store{width:100%;

			   height:200px;

			   position:absolute;

			   top:510px;}

	.app_store > a{width:120px;

					 position:absolute;

				     left:50%;

				     margin-left:-60px;}

 

 }

 

/* 아이폰 6/7/8 플러스 */

 @media screen and (min-width: 414px) and (max-width:736px){

    #back_text_3{
            height:100vh;
            display:none;
    }

	#back_text{display:none;}

	

	#mobile{width:100%;

			height:110vh;}

	#wrap{width:100%;

		  margin:0 auto;}

 
.text_box {
		    width: 350px;
		    height: 300px;
		    text-align: center;
		    /* background-color: green; */
		    font-weight: 300;
		    font-size: 13px;
		    line-height: 20px;
		    position: absolute;
		    top: 190px;
		    left: 50%;
		    margin-left: -175px;
		}

	 /* 앱 오픈 전 전화번호 수집 */

.text_box_2{width:350px;

			  height:300px;

			  text-align:center;

			  /* background-color:green; */

			  font-weight:800;

			  font-size:13px;

			  line-height:25px;

			  position:absolute;

			  top:200px;

			  left:50%;

			  margin-left:-175px;}

.img_box_2 > img {

    width: 110px;

    position: absolute;

    left: 50%;

    margin-left: -55px;}

 

#phone{
    width: calc(100% - 80px);
    padding: 0px 40px;
    top:420px;}

#phoneNum{
		  width:240px;

		  height:45px;
}

	button{width:70px;

		   height:45px;

	       margin-top:0px;}

	 button:hover{background-color:#F58331;

			     color:#fff;}

 

	.app_store{width:100%;

			   height:200px;

			   position:absolute;

			   top:580px;}

	.app_store > a{width:120px;

					 position:absolute;

				     left:50%;

				     margin-left:-60px;}

 

	footer{font-size:13px;}

 

 }

 

 

/* 갤럭시 폴드 ~ 아이폰 5/SE */

@media screen and (min-width: 280px) and (max-width:370px){


    #back_text_3{
            height:100vh;
            display:none;
    }

	#back_text{display:none;}

	#mobile{width:100%;

			height:125vh;}

	#wrap{width:100%;

		margin:0 auto;}

	.img_box{margin-top:30px;}

	.img_box img{width:120px;

				position:absolute;

				left:50%;

				margin-left:-60px;}

	.img_box_2 img{width:100px;

				position:absolute;

				left:50%;

				margin-left:-50px;}

	.text_box{
			  font-weight:300;

			  font-size:12px;

			  line-height:21px;
    }
			  
	 	.text_box2{width:280px;

			  height:300px;

			  text-align:center;

			  /* background-color:green; */

			  font-weight:500;

			  font-size:10px;

			  line-height:20px;

			  position:absolute;

			  top:300px;

			  left:50%;

			  margin-left:-150px;}

	.text_box_2{width:300px;

			  height:300px;

			  text-align:center;

			  /* background-color:green; */

			  font-weight:800;

			  font-size:10px;

			  line-height:20px;

			  position:absolute;

			  top:150px;

			  left:50%;

			  margin-left:-150px;}

    .text-div{
        top: 480px;
        font-size: 10px;
        padding-right: 0px;
        padding-left: 0px;
        margin-top:30px;
    }
    .text-div p{
        padding-left: 5px;
        padding-right: 5px;
    }
    .text-div img{
        margin-top:35px;
    }
 


    #phone{
        width: calc(100% - 20px);
        padding: 0px 10px;
        top:430px;
     }
	#phoneNum{
			  width:190px;

			  height:30px;}

	button{width:60px;

		   height:30px;

	       margin-top:0px;}

	 button:hover{background-color:#F58331;

			     color:#fff;}

 

	.app_store{width:100%;

			   height:200px;

			   position:absolute;

			   top:415px;}

	.app_store img{width:100px;}

	.app_store > a{width:100px;

					 position:absolute;

				     left:50%;

				     margin-left:-50px;}

	footer{font-size:10px;}


    .modal-content {
        width: 250px !important; /* Could be more or less, depending on screen size */
    }
 }

 /* The Modal (background) */
.modal {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 1; /* Sit on top */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
    text-align: center;
}

/* Modal Content/Box */
.modal-content {
    background-color: #fefefe;
    margin: 20% auto; /* 15% from the top and centered */
    padding: 20px;
    padding-bottom: 20px;
    border: 1px solid #888;
    width: 310px; /* Could be more or less, depending on screen size */
    text-align: center;
}

/* The Close Button */
.close {
    color: #aaa;
    float: center;
    font-size: 14px;
    width : 50%;
    font-weight: bold;
}

.close:hover,

.close:focus {
    color: black;
    text-decoration: none;
    cursor: pointer;
}