@charset "utf-8";
@font-face {font-family: "Acme-Regular"; src: url("../font/Acme-Regular.eot") format("embedded-opentype"), url("../font/Acme-Regular.woff") format("woff");}
@font-face {font-family: "SpoqaHanSans-Bold"; src: url("../font/SpoqaHanSans-Bold.eot") format("embedded-opentype"), url("../font/SpoqaHanSans-Bold.woff") format("woff");}
@font-face {font-family: "SpoqaHanSans-Regular"; src: url("../font/SpoqaHanSans-Regular.eot") format("embedded-opentype"), url("../font/SpoqaHanSans-Regular.woff") format("woff");}

/*animation*/
@keyframes slideIn {
	from{transform: translateX(-100px);
    }to{opacity: 1;}
}
.slideIn {animation: slideIn .5s forwards;}
@keyframes rightIn {
	from{transform: translateX(100px);
    }to{opacity: 1;}
}
.rightIn {animation: rightIn .5s forwards;}
@keyframes slideUp {
    from{transform: translateY(20px);
    }to{opacity: 1;}
}
.slideUp {animation: slideUp .5s forwards;}
@keyframes btnDown {
    0%{transform: translateY(-500px);
    }100%{transform: translateY(0); opacity: .5 forwards;}
}
.btnDown {animation: btnDown .5s;}
@keyframes btnUp {
    0%{transform: translateY(0);
    }100%{transform: translateY(-678px); opacity: .5 forwards;}
}
.btnUp {animation: btnUp .5s;}
@keyframes noAni {
    from{opacity: 1;}
}
@keyframes load {
	0% {opacity:0; transform:scale(0,0);}
	60% {transform:scale(1.05,1.05);}
	100% {opacity:1; transform:scale(1,1);}
}

/* common */
.main {padding-top: 60px;}
.main h3 {font-family: "Acme-Regular"; font-size: 3.5rem;}
.main .subMain {height: 310px; padding-top: 294px;}
.main .subMain h3 {font-family: "SpoqaHanSans-Bold"; font-size: 4rem; text-align: center; animation: slideIn 1.5s forwards;}
.products .main .sImg {width: 90.63%; height: 232px; margin: 0 auto;}
.products .sTxt {opacity: 0;}
.products .sTxt p:first-child {font-family: "SpoqaHanSans-Bold"; font-size: 2.4rem; line-height: 2.9rem; margin: 40px 0 15px 4.68%;}
.products .sTxt p:last-child {font-size: 1.6rem; line-height: 2.1rem; margin: 0 0 50px 4.68%;}
.products .caption p {color: #fff;}
.products .caption p:first-child {font-family: "SpoqaHanSans-Bold"; font-size: 1.5rem; line-height: 39px;}
.products .caption p:last-child {display: none;}


/* products_sub01 */

/* .main */
.products #products .subMain {background: url(../img/product.jpg) no-repeat center; background-size: cover;}

/* #chocolate */
.products #chocolate {padding-top: 60px;}
.products #chocolate h3 {height: 50px; margin: 0 0 50px 4.68%; color: #eaa73e;}
.products #chocolate .sImg {background: url("../img/chocolate01.jpg") no-repeat center; background-size: cover;}
.products #chocolate .sTxt p:first-child {font-size: 2.3rem;}
.products #chocolate ul {text-align: center; opacity: 0;}
.products #chocolate ul li a {display: inline-block; width: 81.25%; height: 195px; margin-bottom: 20px;}
.products #chocolate ul li:nth-child(1) a {background: url("../img/chocolate02.jpg") no-repeat center; background-size: cover;}
.products #chocolate ul li:nth-child(2) a {background: url("../img/chocolate03.jpg") no-repeat center; background-size: cover;}
.products #chocolate ul li:nth-child(3) a {background: url("../img/chocolate04.jpg") no-repeat center; background-size: cover;}
.products #chocolate ul li:nth-child(4) a {background: url("../img/chocolate05.jpg") no-repeat center; background-size: cover;}
.products #chocolate .caption {height: 39px; margin-top: 156px; background: rgba(234,167,62,.8);}

/* #chocolixir */
.products #chocolixir h3 {margin: 60px 0 50px 4.68%; color: #c83444; opacity: 0;}
.products #chocolixir .sImg {background: url("../img/chocolixir01.jpg") no-repeat center; background-size: cover;}
.products #chocolixir ul {text-align: center; opacity: 0;}
.products #chocolixir ul li a {display: inline-block; width: 90.62%; height: 320px; margin-bottom: 10px;} 
.products #chocolixir ul li:nth-child(1) a {background: url("../img/chocolixir02.jpg") no-repeat center; background-size: cover;}
.products #chocolixir ul li:nth-child(2) a {background: url("../img/chocolixir03.jpg") no-repeat center; background-size: cover;}
.products #chocolixir ul li:nth-child(3) a {background: url("../img/chocolixir04.jpg") no-repeat center; background-size: cover;}
.products #chocolixir ul li:nth-child(4) a {background: url("../img/chocolixir05.jpg") no-repeat center; background-size: cover;}
.products #chocolixir .caption {height: 64px; margin-top: 256px; background: rgba(200,52,68,.8); padding-top: 16px;}
.products #chocolixir .caption p:first-child {line-height: 1.9rem;}


/* #icecream */
.products #icecream h3 {margin: 70px 0 50px 4.68%; color: #c9ad87; opacity: 0;}
.products #icecream .sImg {background: url("../img/icecream.jpg") no-repeat center; background-size: cover;}
.products #icecream .sTxt {opacity: 1;}
.products #icecream .sTxt p:first-child {font-family: "SpoqaHanSans-Regular"; font-size: 1.5rem; margin-bottom: 20px;}
.products #icecream .btn {position: relative; float: left; width: 50%; height: 60px; background: #c9ad87; text-align: center; margin-bottom: 55px; transition: .5s;}
.products #icecream .btn:hover, .products #icecream .btn:focus {background: #a18a6c;}
.products #icecream .btn a {display: inline-block; width: 100%; height: 100%;}
.products #icecream .btn a span:nth-child(1) {font-family: "SpoqaHanSans-Bold"; font-size: 2.5rem; line-height: 60px; color: #fff;}
.products #icecream .btn a span:nth-child(2), .products #icecream .btn a span:nth-child(3) {display: none;}
.products #icecream .iBar {position: absolute; display: inline-block; width: 1px; height: 40px; background: #fff; top: 10px; left: 99.37%;}
.products #icecream #cup {text-align: center; opacity: 0;}
.products #icecream #cup span:nth-child(1), .products #icecream #cup span:nth-child(3) {display: inline-block; width: 18.75%; height: 1px; background: #c9ad87; margin-bottom: 7px;}
.products #icecream #cup span:nth-child(2) {font-family: "SpoqaHanSans-Bold"; font-size: 2.2rem; color: #c9ad87; margin: 0 3.12%;}
.products #icecream #cup ul li a {display: inline-block; width: 75%; height: 200px;}
.products #icecream #cup ul li:nth-child(1) a {margin-top: 30px; background: url("../img/cup01.png") no-repeat center; background-size: cover;} 
.products #icecream #cup ul li:nth-child(2) a {background: url("../img/cup02.png") no-repeat center; background-size: cover;} 
.products #icecream #cup ul li:nth-child(3) a {background: url("../img/cup03.png") no-repeat center; margin-bottom: 50px; background-size: cover;} 
.products #icecream #cup .caption {height: 48px; background: rgba(201,173,135,.8); margin-top: 152px; padding-top: 7px;}
.products #icecream #cup .caption p:first-child {font-size: 1.5rem; line-height: 1.8rem;}
.products #icecream #soft {text-align: center; opacity: 0;}
.products #icecream #soft span:nth-child(1), .products #icecream #soft span:nth-child(3) {display: inline-block; width: 18.75%; height: 1px; background: #c9ad87; margin-bottom: 7px;}
.products #icecream #soft span:nth-child(2) {font-family: "SpoqaHanSans-Bold"; font-size: 2.2rem; color: #c9ad87; margin: 0 2.34%;}
.products #icecream #soft ul li a {display: inline-block; width: 56.25%; height: 240px;}
.products #icecream #soft ul li:nth-child(1) a {margin-top: 35px; background: url("../img/soft01.png") no-repeat center; background-size: cover;} 
.products #icecream #soft ul li:nth-child(2) a {margin-top: 15px; background: url("../img/soft02.png") no-repeat center; background-size: cover;} 
.products #icecream #soft ul li:nth-child(3) a {margin-top: 15px; margin-bottom: 100px; background: url("../img/soft03.png") no-repeat center; background-size: cover;} 
.products #icecream #soft .caption {height: 48px; background: rgba(201,173,135,.8); margin-top: 192px; padding-top: 7px;}
.products #icecream #soft .caption p:first-child {font-size: 1.5rem; line-height: 1.8rem;}



/* column_sub02 */

/* common */
.column .hWrap .dot {display: none;}
.column .history .sWrap {position: relative; padding-top: 41px; margin: 0 auto;}
.column .history:nth-child(odd) .sWrap  span {left: 7.81%;}
.column .history:nth-child(even) .sWrap span {right: 7.81%;}
.column .history .sWrap span {position: absolute; display: inline-block; font-size: 5rem; font-family: "Acme-Regular"; top: 0; opacity: 0; color: rgba(255,255,255,.8);}
.column .history .sImg {width: 90.62%; max-width: 720px; height: 170px; margin: 0 auto;}
.column .history .sTxt {width: 90.62%; margin: 40px auto 50px;}
.column .history .sTxt p:first-child {font-size: 2.5rem; line-height: 3rem; font-family: "SpoqaHanSans-Bold";}
.column .history .sTxt p:last-child {font-size: 2rem; line-height: 2.6rem; margin-top: 20px;}

/* .main */
.column #column .subMain {background: url("../img/column.jpg") no-repeat center; background-size: cover;}


/* aboutC */
.column #aboutC {padding-top: 100px;}
.column #aboutC h3 {position: relative; margin-left: 4.68%; margin-bottom: 47px; color: #eaa73e; height: 72px;}
.column #aboutC h3 .choco {position: absolute; top: 42px; left: 0;}
.column #aboutC #Y600 .sImg {background: url("../img/aboutchocolate01.jpg") no-repeat; background-size: cover;}
.column #aboutC #Y600 .sTxt p:first-child {width: 190px;}
.column #aboutC #Y1502 .sImg {background: url("../img/aboutchocolate02.jpg") no-repeat; background-size: cover;}
.column #aboutC #Y1519 .sImg {background: url("../img/aboutchocolate03.jpg") no-repeat center; background-size: cover;}
.column #aboutC #Y1528 .sImg {background: url("../img/aboutchocolate04.jpg") no-repeat center; background-size: cover;}
.column #aboutC #Y1606 .sImg {background: url("../img/aboutchocolate05.jpg") no-repeat center; background-size: cover;}
.column #aboutC #Y1657 .sImg {background: url("../img/aboutchocolate06.jpg") no-repeat center; background-size: cover;}
.column #aboutC #Y1671 .sImg {background: url("../img/aboutchocolate07.jpg") no-repeat; background-size: cover;}
.column #aboutC #Y1674 .sImg {background: url("../img/aboutchocolate08.jpg") no-repeat center; background-size: cover;}
.column #aboutC #Y1828 .sImg {background: url("../img/aboutchocolate09.jpg") no-repeat center; background-size: cover;}
.column #aboutC #Y1828 .sTxt p:first-child {width: 225px;}
.column #aboutC #Y1875 .sImg {background: url("../img/aboutchocolate10.jpg") no-repeat center; background-size: cover;}



/* about_sub03 */

/* common */
.about .sImg {height: 125px; margin: 45px 0 40px;}
.about .sTxt {text-align: center; width: 90.62%; margin: 0 auto;}
.about .sTxt p:first-child {font-family: "SpoqaHanSans-Bold"; font-size: 2rem; line-height: 2.6rem;}
.about .sTxt p:last-child {font-size: 1.4rem; line-height: 1.8rem; margin: 20px 0 40px;}
.about #history .his {width: 78.12%; margin: 0 auto;}
.about #history .his span {font-family: "Acme-Regular"; font-size: 3.5rem;}
.about #history .his .yImg {width: 100%; height: 200px; margin-top: 14px;}
.about #history .his .yImg a {display: inline-block; width: 100%; height: 100%; text-indent: -99999px; font-size: 0; line-height: 0; cursor: default;}
.about #history .his p {font-size: 1.5rem; line-height: 1.9rem; margin: 15px auto 25px;}


/* .main */
.about #about .subMain {background: url("../img/about.jpg") no-repeat center; background-size: cover;}

/* #history */
.about #history {padding-top: 100px;}
.about #history h3 {color: #eaa73e; margin-left: 4.68%;} 
.about #history .sImg {background: url("../img/ladyGodiva.jpg") no-repeat center; background-size: cover;}
.about #history .sImg p {font-family: "Acme-Regular"; font-size: 2rem; line-height: 125px; text-align: center;}
.about #history ul {width: 290px; height: 75px; margin: 0 auto;}
.about #history ul li {float: left; width: 75px; height: 100%; border: 1px solid #fff; border-radius: 50%; margin-right: 10.15%; text-align: center; transition: .5s;}
.about #history ul li:last-child {margin-right: 0;}
.about #history ul li:hover, .about #history ul li:focus {background: #eaa73e; border: none;}
.about #history ul li a {display: inline-block; width: 100%; height: 100%; color: #fff; font-size: 1.5rem; line-height: 75px;}
.about #history .bar {display: block; width: 31.25%; height: 1px; margin: 40px auto 45px; background: #fff;}
.about #history .sTxt p:first-child {color: #eaa73e;}
.about #history .Y1926 .yImg a {background: url("../img/history01.jpg") no-repeat center; background-size: cover;}
.about #history .Y1956 .yImg a {background: url("../img/history02.jpg") no-repeat center; background-size: cover;}
.about #history .Y1958 .yImg a {background: url("../img/history03.jpg") no-repeat center; background-size: cover;}

/* #aboutchef */
.about #aboutchef {padding-top: 80px;}
.about #aboutchef h3 {color: #c83444; margin-left: 4.68%;} 
.about #aboutchef .sImg {background: url("../img/aboutchef.jpg") no-repeat center; background-size: cover;}
.about #aboutchef .sTxt p:first-child {color: #c83444;}
.about #aboutchef ul {width: 87.5%; margin: 0 auto;}
.about #aboutchef ul li a {display: inline-block; width: 100%; height: 225px; color: #fff; margin-top: 20px;}
.about #aboutchef ul li:nth-child(1) a {background: url("../img/chef01.jpg") no-repeat center; background-size: cover; margin-top: 0;}
.about #aboutchef ul li:nth-child(2) a {background: url("../img/chef02.jpg") no-repeat center; background-size: cover;}
.about #aboutchef ul li:nth-child(3) a {background: url("../img/chef03.jpg") no-repeat center; background-size: cover;}
.about #aboutchef ul li:nth-child(4) a {background: url("../img/chef04.jpg") no-repeat center; background-size: cover;}
.about #aboutchef ul li a .caption {text-align: center; padding-top: 240px;}
.about #aboutchef ul li a .caption p {font-family: "spoqahansans-Bold";}
.about #aboutchef ul li a .caption p:first-child {font-size: 2rem;}
.about #aboutchef ul li a .caption p:last-child {
    font-size: 2.5rem; margin-top: 10px;
}


/* #chocolates */
.about #chocolates {padding-top: 80px; padding-bottom: 100px;}
.about #chocolates h3 {color: #c9ad87; margin-left: 4.68%;}
.about #chocolates .sImg {background: url("../img/chocolates.jpg") no-repeat center; background-size: cover;}
.about #chocolates .sTxt p:first-child {color: #c9ad87;}
.about #chocolates ul {width: 70.31%; margin: 0 auto; text-align: center;}
.about #chocolates ul li a {display: inline-block; width: 100%; height: 225px; color: #fff;}
.about #chocolates ul li:nth-child(1) a {background: url("../img/chocolates01.jpg") no-repeat center; background-size: cover;}
.about #chocolates ul li:nth-child(2) a {background: url("../img/chocolates02.jpg") no-repeat center; background-size: cover;}
.about #chocolates ul li:nth-child(3) a {background: url("../img/chocolates03.jpg") no-repeat center; background-size: cover;}
.about #chocolates ul li:nth-child(4) a {background: url("../img/chocolates04.jpg") no-repeat center; background-size: cover;}
.about #chocolates ul li:nth-child(5) a {background: url("../img/chocolates05.jpg") no-repeat center; background-size: cover;}
.about #chocolates ul li:nth-child(6) a {background: url("../img/chocolates06.jpg") no-repeat center; background-size: cover;}
.about #chocolates ul li a .caption {padding-top: 236px;}
.about #chocolates ul li a .caption span:first-child {font-size: 2rem;}
.about #chocolates ul li a .caption span:last-child {font-size: 1.5rem; margin-left: 28px;}
.about #chocolates ul li a + p {font-size: 1.4rem; line-height: 1.8rem; margin: 15px 0 25px;}
.about #chocolates ul li:last-child a {position: relative; padding-top: 193px;}
.about #chocolates ul li:last-child a p {font-size: 1.8rem; line-height: 2.4rem;}
.about #chocolates ul li .plus {width: 50px; height: 50px;}
.about #chocolates ul li .plus span {position: absolute; display: inline-block; width: 50px; height: 1px; background: #fff; top: 50%; left: 50%; margin-left: -25px;}
.about #chocolates ul li .plus span:last-child {transform: rotate(90deg);}



/* stores_sub04 */

/* common */
.stores #godiva span, .stores #internal a, .stores p {color: #241e1e;}

/* .main */
.stores #stores .subMain {background: url("../img/stores.jpg") no-repeat center; background-size: cover;}
/* #godiva */
.stores #godiva {padding-top: 100px;}
.stores #godiva ul {width: 90.62%; height: 1380px; margin: 0 auto;} 
.stores #godiva ul li {width: 100%; height: 230px;}
.stores #godiva ul li .sImg {width: 100%; height: 180px;}
.stores #godiva ul li .sImg a {display: inline-block; width: 100%; height: 100%; background-position: center; background-repeat: no-repeat; background-size: cover; transition: .5s; text-indent: -99999px;}
.stores #godiva ul li:nth-child(1) .sImg a {background-image: url("../img/stores01-off.jpg");}
.stores #godiva ul li:nth-child(1):hover .sImg a, .stores #godiva ul li:nth-child(1):focus .sImg a {background-image: url(../img/stores01-on.jpg);}
.stores #godiva ul li:nth-child(2) .sImg a {background-image: url("../img/stores02-off.jpg");}
.stores #godiva ul li:nth-child(2):hover .sImg a, .stores #godiva ul li:nth-child(2):focus .sImg a {background-image: url(../img/stores02-on.jpg);}
.stores #godiva ul li:nth-child(3) .sImg a {background-image: url("../img/stores03-off.jpg");}
.stores #godiva ul li:nth-child(3):hover .sImg a, .stores #godiva ul li:nth-child(3):focus .sImg a {background-image: url(../img/stores03-on.jpg);}
.stores #godiva ul li:nth-child(4) .sImg a {background-image: url("../img/stores04-off.jpg");}
.stores #godiva ul li:nth-child(4):hover .sImg a, .stores #godiva ul li:nth-child(4):focus .sImg a {background-image: url(../img/stores04-on.jpg);}
.stores #godiva ul li:nth-child(5) .sImg a {background-image: url("../img/stores05-off.jpg");}
.stores #godiva ul li:nth-child(5):hover .sImg a, .stores #godiva ul li:nth-child(5):focus .sImg a {background-image: url(../img/stores05-on.jpg);}
.stores #godiva ul li:nth-child(6) .sImg a {background-image: url("../img/stores06-off.jpg");}
.stores #godiva ul li:nth-child(6):hover .sImg a, .stores #godiva ul li:nth-child(6):focus .sImg a {background-image: url(../img/stores06-on.jpg);}
.stores #godiva ul li .caption {position: relative; width: 100%; height: 50px; background: #ebebeb; transition: .5s;}
.stores #godiva ul li:nth-child(even) .caption {background: #f9f9f9;}
.stores #godiva ul li:hover .caption, .stores #godiva ul li:focus .caption, .stores #godiva ul li:nth-child(even):hover .caption, .stores #godiva ul li:nth-child(even):focus .caption  {background: #eaa73e;}
.stores #godiva ul li .caption a {display: inline-block; width: 100%; height: 100%;}
.stores #godiva ul li .caption span {line-height: 50px;}
.stores #godiva ul li .caption span:first-of-type {font-family: "spoqahansans-Bold"; font-size: 2rem; margin: 0 12.5% 0 4.68%;}
.stores #godiva ul li .caption span:last-of-type {font-size: 1.4rem;}
.stores #godiva ul li .caption img {position: absolute; width: 10px; height: 15px; top: 17px; right: 4.68%;}

/* #internal */
.stores #internal {padding-top: 80px;}
.stores #internal h3 {font-family: "SpoqaHanSans-Bold"; text-align: center; font-size: 2.5rem;}
.stores #internal ul {width: 90.62%; height: 894px; margin: 40px auto 100px;}
.stores #internal ul li {width: 100%; height: 150px;}
.stores #internal ul li a {position: relative; display: inline-block; width: 100%; height:  50px; font-size: 1.9rem; line-height: 50px; padding-left: 4.68%; background: #ebebeb; transition: .5s;}
.stores #internal ul li:nth-child(even) a {background: #f9f9f9;}
.stores #internal ul li:hover a, .stores #internal ul li:focus a, .stores #internal ul li:nth-child(even):hover a, .stores #internal ul li:nth-child(even):focus a {background: #eaa73e;}
.stores #internal ul li a img {position: absolute; width: 10px; height: 15px; top: 17px; right: 4.68%;}
.stores #internal ul li div {height: 100px; background: #fff; padding-left: 4.68%; padding-top: 20px;}
.stores #internal ul li div p {font-size: 1.4rem; line-height: 1.8rem;}
.stores #internal ul li div p:last-child {margin-top: 20px;}

/* gte 768px */
@media screen and (min-width: 768px){
    
    /* common */
    .main {padding-top: 80px;}
    .main h3 {font-size: 6rem;}
    .main .subMain {height: 770px; padding-top: 739px; margin-left: 11.45%;}
    .main .subMain h3 {font-size: 8rem; text-align: left; margin-left: 6.51%;}
    .products .main .sImg {width: 84.63%; height: 430px; margin-left: 3.12%; margin-bottom: 90px;}
    .products #chocolate, .products #chocolixir, .products #icecream {position: relative;}
    .products .sTxt {position: absolute;}
    .products .sTxt p:first-child {font-size: 3.4rem; line-height: 4rem; margin: 0;}
    .products .sTxt p:last-child {font-size: 2.5rem; line-height: 3.2rem; margin: 13px 0 0;}
    .products .caption p:last-child {display: block; font-family: "SpoqaHanSans-Bold";}
    .products #chocolate ul li a, .products #chocolixir ul li a {position: absolute;} 
    
    /* products_sub01 */
    .products #products {height: 806px;}
    .products #products .subMain {background-position: left center;}
    
    /* #chocolate */
    .products #chocolate {height: 1320px; padding-top: 90px;}
    .products #chocolate h3 {height: 42px; margin: 0 0 80px 3.12%;}
    .products #chocolate .sTxt {top: 337px; right: 3.12%;}
    .products #chocolate .sTxt p:first-child {font-size: 3.4rem;}
    .products #chocolate ul {text-align: left;}
    .products #chocolate ul li a {width: 46.87%; height: 270px; text-align: center; margin-bottom: 0; margin-left: 3.14%;}
    .products #chocolate ul li:nth-child(even) a {margin-top: 39px; margin-left: 50%;}
    .products #chocolate ul li:nth-child(3) a {margin-top: 270px;}
    .products #chocolate ul li:nth-child(4) a {margin-top: 309px;}
    .products #chocolate ul li:hover .caption, .products #chocolate ul li:focus .caption{opacity: 1;}
    .products #chocolate .caption {opacity: 0; height: 100%; margin: 0; padding-top: 95px; background: rgba(0,0,0,.6); border-bottom: 5px solid #eaa73e; transition: .2s;}
    .products #chocolate li:nth-child(2) .caption {padding-top: 58px;}
    .products #chocolate .caption p:first-child {color: #eaa73e; font-size: 3.7rem; line-height: 4.4rem;}
    .products #chocolate .caption p:last-child {font-size: 2.5rem; margin-top: 25px;}
    
    /* #chocolixir */
    .products #chocolixir {height: 1740px; padding-top: 100px;}
    .products #chocolixir h3 {margin: 0 0 80px 3.12%; height: 42px;}
    .products #chocolixir .sImg {margin-left: 12.1%;}
    .products #chocolixir .sTxt {top: 295px; left: 3.12%;}
    .products #chocolixir ul {text-align: left;}
    .products #chocolixir ul li a {width: 46.87%; height: 480px; text-align: center; margin-bottom: 0; margin-left: 3.14%;}
    .products #chocolixir ul li:nth-child(even) a {margin-top: 40px; margin-left: 50%;}
    .products #chocolixir ul li:nth-child(3) a {margin-top: 480px;}
    .products #chocolixir ul li:nth-child(4) a {margin-top: 520px;}
    .products #chocolixir ul li:hover .caption, .products #chocolixir ul li:focus .caption{opacity: 1;}
    .products #chocolixir .caption {opacity: 0; height: 100%; margin: 0; padding-top: 185px; background: rgba(0,0,0,.7); border-bottom: 5px solid #c83444; transition: .2s;}
    .products #chocolixir .caption p:first-child {color: #c83444; font-size: 3rem; line-height: 3.6rem;}
    .products #chocolixir .caption p:last-child {font-size: 2rem; line-height: 2.6rem; margin-top: 25px;}
    
    /* #icecream */
    .products #icecream {height: 1564px; padding-top: 98px; margin-bottom: 65px;}
    .products #icecream h3 {margin: 0 0 80px 3.12%; height: 42px;}
    .products #icecream .sImg {margin-bottom: 144px;}
    .products #icecream .sTxt {top: 310px; right: 3.12%; opacity: 0;}
    .products #icecream .sTxt p:first-child {font-size: 2rem; margin-bottom: 10px;}
    .products #icecream .btn {width: 96.25%; height: 130px; clear: both; margin-bottom: 0; text-align: left;}
    .products #icecream .btn a span:nth-child(1) {font-size: 3rem; line-height: 130px; color: #fff; margin: 0 3.33% 0 8.05%;}
    .products #icecream .btn a span:nth-child(2) {display: inline-block; font-family: "SpoqaHanSans-Bold"; font-size: 3rem; line-height: 130px; color: #fff;} 
    .products #icecream .btn a span:nth-child(3) {position: absolute; display: inline-block; width: 20px; height: 40px; margin-left: 20%; background: url("../img/icon_arrow.png") no-repeat; background-size: contain; top: 45px;}
    .products #icecream .btn:last-child a span:nth-child(3) {margin-left: 15%;}
    .products #icecream .iBar {width: 210px; height: 1px; top: 129px; left: 50px; z-index:1;}
    .products #icecream #cup {height: 365px;}
    .products #icecream #cup span:nth-child(1), .products #icecream #cup span:nth-child(3) {display: inline-block; width: 19.53%; height: 1px; background: #c9ad87; margin-bottom: 14px;}
    .products #icecream #cup span:nth-child(2) {font-size: 3.5rem; color: #c9ad87; margin: 0 6.38%;}
    .products #icecream #cup ul {display: inline-block; width: 93.75%; height: 242px;}
    .products #icecream #cup ul li {display: inline-block; width: 31.25%; height: 100%; text-align: center;} 
    .products #icecream #cup ul li a {width: 100%; height: 200px; margin-top: 42px;} 
    .products #icecream #cup ul li:nth-child(1) a {margin-top: 42px;}
    .products #icecream #cup ul li:hover .caption, .products #icecream #cup ul li:focus .caption {opacity: 1;}
    .products #icecream #cup .caption {opacity: 0; height: 100%; background: rgba(0,0,0,.5); margin-top: 0; padding-top: 61px; border-bottom: 5px solid #c9ad87; transition: .2s;}
    .products #icecream #cup .caption p:first-child {font-size: 2.1rem; line-height: 2.5rem; color: #c9ad87;}
    .products #icecream #cup .caption p:last-child {font-size: 1.6rem; margin-top: 15px;}
    .products #icecream #soft {height: 501px;}
    .products #icecream #soft span:nth-child(1), .products #icecream #soft span:nth-child(3) {display: inline-block; width: 19.53%; height: 1px; background: #c9ad87; margin-bottom: 14px;}
    .products #icecream #soft span:nth-child(2) {font-size: 3.5rem; color: #c9ad87; margin: 0 5.46%;}
    .products #icecream #soft ul {display: inline-block; width: 93.75%; height: 380px; text-align: center;}
    .products #icecream #soft ul li {display: inline-block; width: 31.25%; height: 100%;} 
    .products #icecream #soft ul li a {width: 100%; height: 320px;} 
    .products #icecream #soft ul li:nth-child(1) a, .products #icecream #soft ul li:nth-child(2) a,
    .products #icecream #soft ul li:nth-child(3) a {margin-top: 60px;}
    .products #icecream #soft ul li:hover .caption, .products #icecream #soft ul li:focus .caption {opacity: 1;}
    .products #icecream #soft .caption {opacity: 0; height: 100%; background: rgba(0,0,0,.5); margin-top: 0; padding-top: 105px; border-bottom: 5px solid #c9ad87; transition: .2s;}
    .products #icecream #soft .caption p:first-child {font-size: 2.4rem; line-height: 2.9rem; color: #c9ad87;}
    .products #icecream #soft .caption p:last-child {font-size: 2rem; line-height: 2.6rem; margin-top: 15px;}
    
    
    /* column_sub02 */
    
    /* common */
    .column .history .sWrap {padding-top: 67px; max-width: 720px;}
    .column .history:nth-child(even) .sWrap span {right: 6.25%;}
    .column .history:nth-child(odd) .sWrap  span {left: 6.25%;}
    .column .history .sWrap span {font-size: 8rem;}
    .column .history .sImg {width: 93.75%; height: 340px;}
    .column .history .sTxt {width: 93.75%; max-width: 720px; margin: 59px auto 72px;}
    .column .history .sTxt p:first-child {font-size: 3.5rem; line-height: 4.2rem;} 
    .column .history .sTxt p:last-child {font-size: 2.5rem; line-height: 3.3rem;}
    
    /* #aboutC */
    .column #aboutC {padding-top: 120px;}
    .column #aboutC h3 {margin-left: 3.12%; margin-bottom: 102px; height: 52px;}
    .column #aboutC h3 .choco {position: static; margin-left: 23px;}
    .column #aboutC #Y600 .sTxt p:first-child, .column #aboutC #Y1828 .sTxt p:first-child {width: auto;}
    
    
    
    /* about_sub03 */
    
    /* common */
    .about .sImg {height: 250px; margin: 80px 0 100px;}
    .about .sTxt {width: 93.75%;}
    .about .sTxt p:first-child {font-size: 3.5rem; line-height: 4.2rem;}
    .about .sTxt p:last-child {font-size: 2.5rem; line-height: 3.3rem; margin: 30px 0 100px;}
    .about #history .his {width: 65.1%;}
    .about #history .his span {font-size: 7rem;}
    .about #history .his .yImg {width: 100%; height: 400px; margin-top: 32px; overflow: hidden;}
    .about #history .his .yImg a {transition: .5s ease-out; cursor: pointer;}
    .about #history .his .yImg:hover a, .about #history .his .yImg:focus a {transform: scale(1.05,1.05);}
    .about #history .his p {font-size: 3rem; line-height: 3.9rem; margin: 29px auto 36px;}

    
    /* #history */
    .about #history {padding-top: 120px;}
    .about #history h3 {margin-left: 3.12%;}
    .about #history .sImg p {font-size: 4rem; line-height: 250px;}
    .about #history ul {width: 720px; height: 200px;}
    .about #history ul li {width: 200px; margin-right: 8.07%;}
    .about #history ul li a {font-size: 3.5rem; line-height: 200px;}
    .about #history .bar {width: 26.04%; margin: 100px auto 80px;}
    
    /* #aboutchef */
    .about #aboutchef {padding-top: 100px;}
    .about #aboutchef h3 {margin-left: 3.12%;} 
    .about #aboutchef ul {width: 72.91%;}
    .about #aboutchef ul li a {height: 450px; margin-top: 40px;}
    .about #aboutchef ul li a .caption {text-align: center; height: 100%; padding-top: 184px; background: rgba(0,0,0,.4); border-bottom: 5px solid #c9ad87; opacity: 0; transition: .5s;}
    .about #aboutchef ul li:hover .caption, .about #aboutchef ul li:focus .caption {opacity: 1;}
    .about #aboutchef ul li a .caption p:first-child {font-size: 3rem;}
    .about #aboutchef ul li a .caption p:last-child {font-size: 4rem; margin-top: 20px;}
    
    
    /* #chocolates */
    .about #chocolates {padding-top: 100px; padding-bottom: 200px;}
    .about #chocolates h3 {margin-left: 3.12%;}
    .about #chocolates ul {width: 720px; height: 1748px;}
    .about #chocolates ul li {float: left; width: 50%; height: 600px;}
    .about #chocolates ul li a {width: 100%; height: 360px;}
    .about #chocolates ul li a .caption {height: 100%; padding-top: 166px; background: rgba(0,0,0,.6); border-bottom: 5px solid #c9ad87; opacity: 0; transition: .5s;}
    .about #chocolates ul li:hover .caption, .about #chocolates ul li:focus .caption {opacity: 1;}
    .about #chocolates ul li a .caption span:first-child {font-size: 3.5rem;}
    .about #chocolates ul li a .caption span:last-child {font-size: 2.5rem; margin-left: 38px;}
    .about #chocolates ul li a + p {width: 95%; font-size: 2.5rem; line-height: 3.3rem; margin: 19px auto 0;}
    .about #chocolates ul li .plus {width: 100px; height: 100px;}
    .about #chocolates ul li .plus span {width: 100px; height: 2px; top: 50%; left: 50%; margin-left: -50px;}
    .about #chocolates ul li:last-child a {padding-top: 277px;}
    .about #chocolates ul li:last-child a p {font-size: 3.3rem; line-height: 4.3rem;}
    
    
    
    /* stores_sub04 */
    
    /* #godiva */
    .stores #godiva {padding-top: 120px;}
    .stores #godiva ul {width: 93.75%; height: 1006px;}
    .stores #godiva ul li {float: left; width: 50%; height: 322px;}
    .stores #godiva ul li .sImg {overflow: hidden; height: 242px;}
    .stores #godiva ul li .sImg a {transition: .5s ease-out;}
    .stores #godiva ul li:hover .sImg a, .stores #godiva ul li:focus .sImg a {transform: scale(1.05,1.05);}
    .stores #godiva ul li:nth-child(3), .stores #godiva ul li:nth-child(4), .stores #godiva ul li:nth-child(5), .stores #godiva ul li:nth-child(6) {margin-top: 20px;}
    .stores #godiva ul li .caption {height: 80px;}
    .stores #godiva ul li .caption span {line-height: 80px;}
    .stores #godiva ul li .caption span:first-of-type {font-size: 3rem; margin: 0 11.11% 0 5.55%;}
    .stores #godiva ul li .caption span:last-of-type {font-size: 2rem;}
    .stores #godiva ul li .caption img {width: 14px; height: 20px; top: 30px; right: 4.16%;}
    
    /* #internal */
    .stores #internal {padding-top: 100px;}
    .stores #internal h3 {font-size: 5rem;}
    .stores #internal ul {width: 93.75%; height: 730px; margin: 80px auto 100px;}
    .stores #internal ul li {float: left; width: 50%; height: 230px;}
    .stores #internal ul li:nth-child(3), .stores #internal ul li:nth-child(4), .stores #internal ul li:nth-child(5), .stores #internal ul li:nth-child(6) {margin-top: 20px;}
    .stores #internal ul li a {width: 100%; height:  80px; font-size: 2.5rem; line-height: 80px; padding-left: 6.66%;}
    .stores #internal ul li a img {width: 14px; height: 20px; top: 30px; right: 4.16%;}
    .stores #internal ul li div {height: 150px; padding-left: 6.66%; padding-top: 20px;}
    .stores #internal ul li div p {font-size: 2rem; line-height: 2.6rem;}
    .stores #internal ul li div p:last-child {margin-top: 20px;}
    
    
}


/* gte 1100px */
@media screen and (min-width: 1100px){
    
    /* common */
    .main {padding-top: 0; margin-left: 87px;}
    .main .subMain {width: 89.1%; height: 564px; padding-top: 525px; margin-left: 10.9%;}
    .main .subMain h3 {font-size: 8rem; text-align: left; margin-left: 3.19%;}
    .products .main h3 {position: relative; margin: 0 0 41px 6.14%; height: 51px;}
    .products .main h3 span {position: absolute; top:0; opacity: 0;}
    .products .main .sImg {width: 64.35%; height: 505px; margin-left: 11.06%; margin-bottom: 59px;}
    .products .sTxt p:first-child {font-size: 2.5rem; line-height: 3rem;}
    .products .sTxt p:last-child {margin: 15px 0 0; font-size: 2rem; line-height: 2.6rem;}

    
    /* products_sub01 */
    .products #products {height: 640px;} 

    /* #chocolate */
    .products #chocolate {height: 1428px; padding-top: 69px;}
    .products #chocolate h3 span:nth-child(1) {animation-delay: .8s;} 
    .products #chocolate h3 span:nth-child(2) {left: 40px; animation-delay: .7s;}
    .products #chocolate h3 span:nth-child(3) {left: 85px; animation-delay: .6s;}
    .products #chocolate h3 span:nth-child(4) {left: 130px; animation-delay: .5s;}
    .products #chocolate h3 span:nth-child(5) {left: 165px; animation-delay: .4s;}
    .products #chocolate h3 span:nth-child(6) {left: 205px; animation-delay: .3s;}
    .products #chocolate h3 span:nth-child(7) {left: 240px; animation-delay: .2s;}
    .products #chocolate h3 span:nth-child(8) {left: 280px; animation-delay: .1s;}
    .products #chocolate h3 span:nth-child(9) {left: 315px;}
    .products #chocolate .sTxt {top: 438px; right: 9.88%;}
    .products #chocolate .sTxt p:first-child {font-size: 2.5rem;}
    .products #chocolate ul li a {width: 37.98%; height: 340px; margin-left: 10.94%;}
    .products #chocolate ul li:nth-child(even) a {margin-left: 50%; margin-top: 0;}
    .products #chocolate ul li:nth-child(3) a,.products #chocolate ul li:nth-child(4) a {margin-top: 363px;}
    .products #chocolate .caption {padding-top: 115px;}
    .products #chocolate li:nth-child(2) .caption {padding-top: 115px;}
    
    /* #chocolixir */
    .products #chocolixir {height: 1047px; padding-top: 67px;}
    .products #chocolixir h3 {margin: 0 0 45px 6.14%; opacity: 1;}
    .products #chocolixir h3 span:nth-child(1) {animation-delay: .9s;} 
    .products #chocolixir h3 span:nth-child(2) {left: 40px; animation-delay: .8s;}
    .products #chocolixir h3 span:nth-child(3) {left: 85px; animation-delay: .7s;}
    .products #chocolixir h3 span:nth-child(4) {left: 130px; animation-delay: .6s;}
    .products #chocolixir h3 span:nth-child(5) {left: 170px; animation-delay: .5s;}
    .products #chocolixir h3 span:nth-child(6) {left: 215px; animation-delay: .4s;}
    .products #chocolixir h3 span:nth-child(7) {left: 245px; animation-delay: .3s;}
    .products #chocolixir h3 span:nth-child(8) {left: 270px; animation-delay: .2s;}
    .products #chocolixir h3 span:nth-child(9) {left: 310px; animation-delay: .1s;} 
    .products #chocolixir h3 span:nth-child(10) {left: 330px;}
    .products #chocolixir .sImg {margin-left: 24.46%;}
    .products #chocolixir .sTxt {top: 378px; left: 8.32%;}
    .products #chocolixir ul li a {width: 20.11%; height: 320px; margin-left: 6.14%;}
    .products #chocolixir ul li:nth-child(even) a {margin:0;}
    .products #chocolixir ul li:nth-child(2) a {margin-top: 0; margin-left: 28.71%;} 
    .products #chocolixir ul li:nth-child(3) a {margin-top: 0; margin-left: 51.17%;}
    .products #chocolixir ul li:nth-child(4) a {margin-top: 0; margin-left: 73.74%;}
    .products #chocolixir .caption {padding-top: 76px;}
    .products #chocolixir .caption p:first-child {font-size: 2.8rem; line-height: 3.4rem;}
    .products #chocolixir .caption p:last-child {font-size: 1.8rem; line-height: 2.3rem; margin-top: 10px;}
    
    /* #icecream */
    .products #icecream {height: 1388px; padding-top: 67px;}
    .products #icecream h3 {margin: 0 0 45px 6.14%; opacity: 1;}
    .products #icecream h3 span:nth-child(1) {animation-delay: .7s;} 
    .products #icecream h3 span:nth-child(2) {left: 25px; animation-delay: .6s;}
    .products #icecream h3 span:nth-child(3) {left: 65px; animation-delay: .5s;}
    .products #icecream h3 span:nth-child(4) {left: 105px; animation-delay: .4s;}
    .products #icecream h3 span:nth-child(5) {left: 145px; animation-delay: .3s;}
    .products #icecream h3 span:nth-child(6) {left: 185px; animation-delay: .2s;}
    .products #icecream h3 span:nth-child(7) {left: 220px; animation-delay: .1s;}
    .products #icecream h3 span:nth-child(8) {left: 265px;}
    .products #icecream .sImg {margin-bottom: 44px;}
    .products #icecream .sTxt {top: 350px; right: 10.78%;}
    .products #icecream .sTxt p:first-child {font-size: 2rem; margin-bottom: 20px;}
    .products #icecream .btn {width: 102.56%; height: 118px;}
    .products #icecream .btn a span:nth-child(1) {font-size: 3rem; line-height: 118px; margin: 0 2.5% 0 12.5%;}
    .products #icecream .btn a span:nth-child(2) {font-size: 3rem; line-height: 118px;} 
    .products #icecream .btn a span:nth-child(3) {width: 22px; height: 45px; margin-left: 19.91%; top: 39px;}
    .products #icecream .btn:last-child a span:nth-child(3) {margin-left: 16.16%;}
    .products #icecream .iBar {width: 200px; top: 116px; left: 70px;}
    .products #icecream #cup {height: 284px;}
    .products #icecream #cup span:nth-child(1), .products #icecream #cup span:nth-child(3) {width: 15.64%; height: 1px; margin-bottom: 11px;}
    .products #icecream #cup span:nth-child(2) {margin: 0 2.79%; font-size: 3rem;}
    .products #icecream #cup ul {width: 73.4%; height: 257px; margin: 0 auto;}
    .products #icecream #cup ul li {float: left; width: 27.39%; margin-right: 8.9%;}
    .products #icecream #cup ul li:nth-child(3) {margin-right: 0;}
    .products #icecream #cup ul li a {width: 100%; max-width: 360px; height: 170px; margin-top: 0;}
    .products #icecream #cup ul li:nth-child(1) a, .products #icecream #cup ul li:nth-child(2) a {margin-top: 40px;}
    .products #icecream #cup ul li:nth-child(3) a {margin-top: 40px; margin-bottom: 0;}
    .products #icecream #cup .caption {padding-top: 15%;}
    .products #icecream #cup .caption p:first-child {font-size: 2.3rem; line-height: 2.7rem;}
    .products #icecream #cup .caption p:last-child {font-size: 1.6rem; line-height: 2rem; margin-top: 3%;}
    
    .products #icecream #soft {height: 408px;}
    .products #icecream #soft span:nth-child(1), .products #icecream #soft span:nth-child(3) {width: 15.64%; height: 1px; margin-bottom: 11px;}
    .products #icecream #soft span:nth-child(2) {margin: 0 2.23%; font-size: 3rem;}
    .products #icecream #soft ul {width: 73.4%; height: 454px; margin: 0 auto;}
    .products #icecream #soft ul li {float: left; width: 25.11%; max-width: 330px; height: 310px; margin-right: 12.3%;}
    .products #icecream #soft ul li:nth-child(3) {margin-right: 0;}
    .products #icecream #soft ul li a {width: 100%; height: 310px;} 
    .products #icecream #soft ul li:nth-child(1) a, .products #icecream #soft ul li:nth-child(2) a,
    .products #icecream #soft ul li:nth-child(3) a {margin-top: 40px;}
    .products #icecream #soft .caption {padding-top: 95px;}
    .products #icecream #soft .caption p:first-child {font-size: 2.5rem; line-height: 3rem;}
    .products #icecream #soft .caption p:last-child {font-size: 1.8rem; line-height: 2.3rem; margin-top: 15px;} 
    
    
    /* column_sub02 */
    
    /* common */
    .column .history {padding-top: 33px; padding-bottom: 163px;}
    .column .history .sWrap {max-width: 100%; height: 260px;}
    .column .history:nth-child(odd) .sWrap  span {left: 52.79%;}
    .column .history:nth-child(even) .sWrap span {right: 52.79%;}
    .column .history .sImg {position: absolute; width: 40.22%; height: 227px; margin: 0;}
    .column .history .sTxt {position: absolute; width: 40.22%; max-width: 100%; margin: 0;}
    .column .history .sTxt p:last-child {margin-top: 50px;}
    .column .history .sImg.left {right: 50%;}
    .column .history .sTxt.left {right: 53.35%;}
    .column .history .sImg.right {left: 50%;}
    .column .history .sTxt.right {left: 53.35%;}
    .column .history .sTxt p:first-child {font-size: 2.5rem; line-height: 3.3rem;} 
    .column .history .sTxt p:last-child {font-size: 2rem; line-height: 2.6rem;}
    
    
    /* aboutC */ 
    .column #aboutC {padding-top: 114px;}
    .column .hWrap {position: relative; width: 80.39%; margin: 0 auto 100px;}
    .column .hWrap:after {content: ""; position: absolute; top: 0px; left: 50%; width: 1px; height: 100%; background: #eeeeee; z-index: 2;}
   
    .column .history {position: relative;}
    .column .history .btnDot {display: inline-block; position: absolute; margin-left: -12px; top: -16px; left: 50%;  width: 25px; height: 25px; text-align: center; border-radius: 50%; z-index: 4; transition: .5s ease-in;}
    .column .history .btnDot.on, .column .history .btnDot:hover, .column .history .btnDot:focus {background: rgba(234,167,62,0.2);}
    .column .history .btnDot a {display: inline-block; width: 100%; height: 100%; font-size: 0;}
    .column .history .btnDot.on .dot, .column .history .btnDot:hover .dot, .column .history .btnDot:focus .dot {background: #eaa73e;}
    .column .history .dot {position: absolute; display: inline-block; width: 7px; height: 7px; border-radius: 50%; vertical-align: middle; text-indent: -99999px; top: 9px; left: 50%; margin-left: -3px; background: #dcdcdc; z-index: 3;}
    .column #aboutC h3 span {position: absolute; top:0;}
    .column #aboutC h3 span span {opacity: 0;}
    .column #aboutC h3 .choco {margin-left: 0;}
    .column #aboutC h3 .about span:nth-child(1) {animation-delay: 1.3s;} 
    .column #aboutC h3 .about span:nth-child(2) {left: 40px; animation-delay: 1.2s;}
    .column #aboutC h3 .about span:nth-child(3) {left: 80px; animation-delay: 1.1s;}
    .column #aboutC h3 .about span:nth-child(4) {left: 122px; animation-delay: 1s;}
    .column #aboutC h3 .about span:nth-child(5) {left: 165px; animation-delay: .9s;}
    .column #aboutC h3 .choco span:nth-child(1) {left: 215px; animation-delay: .8s;}
    .column #aboutC h3 .choco span:nth-child(2) {left: 250px; animation-delay: .7s;}
    .column #aboutC h3 .choco span:nth-child(3) {left: 293px; animation-delay: .6s;}
    .column #aboutC h3 .choco span:nth-child(4) {left: 335px; animation-delay: .5s;}
    .column #aboutC h3 .choco span:nth-child(5) {left: 373px; animation-delay: .4s;}
    .column #aboutC h3 .choco span:nth-child(6) {left: 415px; animation-delay: .3s;}
    .column #aboutC h3 .choco span:nth-child(7) {left: 445px; animation-delay: .2s;}
    .column #aboutC h3 .choco span:nth-child(8) {left: 485px; animation-delay: .1s;}
    .column #aboutC h3 .choco span:nth-child(9) {left: 520px;}
    
    
    /* about_sub03 */
    
    /* common */
    .about h3 span {position: absolute; top: 0; opacity: 0;}
    .about .sImg {height: 334px; margin: 60px 0 80px;}
    .about .sTxt {width: 66.68%; height: 225px; margin-bottom: 80px;}
    .about .sTxt p {float: left; text-align: left; top: 0;} 
    .about .sTxt p:first-child{width: 26.95%; font-size: 2.5rem; line-height: 3rem;}
    .about .sTxt p:last-child {width: 58%; margin: 0; margin-left: 14.14%; font-size: 2rem; line-height: 2.6rem;}
    .about #history .hisW {width: 81.79%; height: 566px; margin: 0 auto;}
    .about #history .his {width: 31.8%; float: left; margin-right: 1.71%;}
    .about #history .his:last-child {margin-right: 0;}
    .about #history .his span {font-size: 6rem;}
    .about #history .his .yImg {height: 270px;}
    .about #history .his p {font-size: 2rem; line-height: 2.6rem; margin-bottom: 0;}
    
    /* #history */
    .about #history {padding-top: 113px;}
    .about #history h3 {position: relative; margin-left: 6.14%; height: 52px;}
    .about #history h3 span:nth-child(1) {animation-delay: .6s;}
    .about #history h3 span:nth-child(2) {left: 45px; animation-delay: .5s;}
    .about #history h3 span:nth-child(3) {left: 70px; animation-delay: .4s;}
    .about #history h3 span:nth-child(4) {left: 110px; animation-delay: .3s;}
    .about #history h3 span:nth-child(5) {left: 145px; animation-delay: .2s;}
    .about #history h3 span:nth-child(6) {left: 190px; animation-delay: .1s;}
    .about #history h3 span:nth-child(7) {left: 230px;}
    .about #history .sImg p {font-size: 5rem; line-height: 334px;}
    .about #history ul {width: 885px;}
    .about #history ul li {width: 135px; height: 135px; margin: 0 80px 0;}
    .about #history ul li a {font-size: 2.5rem; line-height: 135px;}
    .about #history .bar {width: 15.62%; margin: 78px auto 67px;}
    .about #history .sTxt {height: 174px;}
    
    /* #aboutchef */
    .about #aboutchef {padding-top: 100px;}
    .about #aboutchef h3 {position: relative; margin-left: 6.14%; height: 52px;}
    .about #aboutchef h3 span:nth-child(1) {animation-delay: .8s;}
    .about #aboutchef h3 span:nth-child(2) {left: 48px; animation-delay: .7s;}
    .about #aboutchef h3 span:nth-child(3) {left: 90px; animation-delay: .6s;}
    .about #aboutchef h3 span:nth-child(4) {left: 135px; animation-delay: .5s;}
    .about #aboutchef h3 span:nth-child(5) {left: 183px; animation-delay: .4s;}
    .about #aboutchef h3 span:nth-child(6) {left: 240px; animation-delay: .3s;}
    .about #aboutchef h3 span:nth-child(7) {left: 280px; animation-delay: .2s;}
    .about #aboutchef h3 span:nth-child(8) {left: 328px; animation-delay: .1s;}
    .about #aboutchef h3 span:nth-child(9) {left: 365px;}
    .about #aboutchef ul {width: 81.79%; height: 855px;}
    .about #aboutchef ul li {float: left; width: 46.22%; height: 400px;}
    .about #aboutchef ul li a {height: 100%; margin-top: 0;}
    .about #aboutchef ul li:nth-child(odd) { margin-right: 7.5%;}
    .about #aboutchef ul li:nth-child(3), .about #aboutchef ul li:nth-child(4) {margin-top: 53px;}
    .about #aboutchef ul li a .caption {padding-top: 167px;}
    .about #aboutchef ul li a .caption p:first-child  {font-size: 2.5rem;}
    .about #aboutchef ul li a .caption p:last-child {font-size: 3.5rem; margin-top: 20px;}
    
    /* #chocolates */
    .about #chocolates {padding-top: 100px; padding-bottom: 100px;}
    .about #chocolates h3 {position: relative; margin-left: 6.14%; height: 52px;}
    .about #chocolates h3 span:nth-child(1) {animation-delay: 1s;}
    .about #chocolates h3 span:nth-child(2) {left: 40px; animation-delay: .9s;}
    .about #chocolates h3 span:nth-child(3) {left: 90px; animation-delay: .8s;}
    .about #chocolates h3 span:nth-child(4) {left: 140px; animation-delay: .7s;}
    .about #chocolates h3 span:nth-child(5) {left: 183px; animation-delay: .6s;}
    .about #chocolates h3 span:nth-child(6) {left: 233px; animation-delay: .5s;}
    .about #chocolates h3 span:nth-child(7) {left: 270px; animation-delay: .4s;}
    .about #chocolates h3 span:nth-child(8) {left: 320px; animation-delay: .3s;}
    .about #chocolates h3 span:nth-child(9) {left: 360px; animation-delay: .2s;}
    .about #chocolates h3 span:nth-child(10) {left: 400px; animation-delay: .1s;}
    .about #chocolates h3 span:nth-child(11) {left: 420px;}
    .about #chocolates .sTxt {height: 98px;}
    .about #chocolates ul {width: 81.79%; height: 1176px}
    .about #chocolates ul li {width: 28.65%; height: 527px; margin-right: 6.97%;}
    .about #chocolates ul li:nth-child(3), .about #chocolates ul li:nth-child(6) {margin-right: 0;}
    .about #chocolates ul li a {height: 300px;}
    .about #chocolates ul li a .caption {padding-top: 141px;}
    .about #chocolates ul li a .caption span:first-child {font-size: 3rem;}
    .about #chocolates ul li a .caption span:last-child {font-size: 2rem; margin-left: 26px;}
    .about #chocolates ul li a + p {font-size: 2rem; line-height: 2.6rem; margin: 30px auto 67px;}
    .about #chocolates ul li:last-child a {padding-top: 223px;}
    
    
}
/* gte 1300px */
@media screen and (min-width: 1300px){
    
    /* common */
    .main {margin-left: 130px;}
    .main h3 {font-size: 7rem;}
    .main .subMain {width: 89.1%; height: 845px; padding-top: 809px;}
    .main .subMain h3 {font-size: 9.6rem;}
    .products .main .sImg {height: 756px; margin-bottom: 90px;}
    .products .sTxt p:first-child {font-size: 3.5rem; line-height: 4.2rem;}
    .products .sTxt p:last-child {margin: 26px 0 0;}

    
    /* products_sub01 */
    .products #products {height: 949px;}

    /* #chocolate */
    .products #chocolate {height: 2113px; padding-top: 69px;}
    .products #chocolate h3 {height: 62px; margin-left: 6.14%;}
    .products #chocolate h3 span:nth-child(2) {left: 40px;}
    .products #chocolate h3 span:nth-child(3) {left: 90px;}
    .products #chocolate h3 span:nth-child(4) {left: 140px;}
    .products #chocolate h3 span:nth-child(5) {left: 180px;}
    .products #chocolate h3 span:nth-child(6) {left: 225px;}
    .products #chocolate h3 span:nth-child(7) {left: 260px;}
    .products #chocolate h3 span:nth-child(8) {left: 305px;}
    .products #chocolate h3 span:nth-child(9) {left: 340px;}
    .products #chocolate .sTxt {top: 448px;}
    .products #chocolate .sTxt p:first-child {font-size: 3.5rem;}
    .products #chocolate ul li a {height: 510px;}
    .products #chocolate ul li:nth-child(3) a,.products #chocolate ul li:nth-child(4) a {margin-top: 543px;}
    .products #chocolate .caption {padding-top: 215px;}
    .products #chocolate li:nth-child(2) .caption {padding-top: 215px;}
    
    /* #chocolixir */
    .products #chocolixir {height: 1540px; padding-top: 100px;}
    .products #chocolixir h3 {height: 62px; margin-left: 6.14%;}
    .products #chocolixir .sTxt {top: 449px;}
    .products #chocolixir ul li a {height: 480px;}
    .products #chocolixir .caption {padding-top: 176px;}
    .products #chocolixir .caption p:last-child {margin-top: 18px;}
    
    /* #icecream */
    .products #icecream {height: 1968px; padding-top: 100px;}
    .products #icecream h3 {height: 62px; margin-left: 6.14%;}
    .products #icecream .sImg {margin-bottom: 66px;}
    .products #icecream .sTxt {top: 452px;}
    .products #icecream .sTxt p:first-child {font-size: 2.5rem; margin-bottom: 30px;}
    .products #icecream .btn {height: 170px;}
    .products #icecream .btn a span:nth-child(1) {font-size: 3.5rem; line-height: 170px;}
    .products #icecream .btn a span:nth-child(2) {font-size: 3.5rem; line-height: 170px;} 
    .products #icecream .btn a span:nth-child(3) {width: 27px; height: 50px; margin-left: 22.91%; top: 60px;}
    .products #icecream .btn:last-child a span:nth-child(3) {margin-left: 19.16%;}
    .products #icecream .iBar {width: 210px; top: 169px; left: 70px;}
    .products #icecream #cup {height: 425px;}
    .products #icecream #cup span:nth-child(1), .products #icecream #cup span:nth-child(3) {margin-bottom: 14px;}
    .products #icecream #cup ul {height: 300px;}
    .products #icecream #cup ul li a {height: 300px;}
    .products #icecream #cup .caption {padding-top: 30%;}
    .products #icecream #cup .caption p:first-child {font-size: 2.8rem; line-height: 3.3rem;}
    .products #icecream #cup .caption p:last-child {font-size: 1.9rem; line-height: 2.5rem; margin-top: 6%;}
    
    .products #icecream #soft {height: 606px;}
    .products #icecream #soft span:nth-child(1), .products #icecream #soft span:nth-child(3) {margin-bottom: 14px;}
    .products #icecream #soft ul {height: 454px;}
    .products #icecream #soft ul li {height: 100%;}
    .products #icecream #soft ul li a {height: 440px;} 
    .products #icecream #soft .caption {padding-top: 155px;}
    .products #icecream #soft .caption p:first-child {font-size: 3rem; line-height: 3.6rem;}
    .products #icecream #soft .caption p:last-child {font-size: 2rem; line-height: 2.6rem; margin-top: 25px;} 
    
    
    /* column_sub02 */
    
    /* common */
    .column .history {padding-top: 50px; padding-bottom: 220px;}
    .column .history .sWrap {height: 408px;}
    .column .history .sImg {height: 340px;}
    .column .history .sTxt p:first-child {font-size: 3.5rem; line-height: 4.2rem;} 
    .column .history .sTxt p:last-child {font-size: 2.5rem; line-height: 3.3rem; margin-top: 80px;}
    
    
    /* aboutC */ 
    .column #aboutC {padding-top: 174px;}
    .column #aboutC h3 {margin-left: 6.14%;}
    .column #aboutC h3 .about span:nth-child(2) {left: 45px;}
    .column #aboutC h3 .about span:nth-child(3) {left: 85px;}
    .column #aboutC h3 .about span:nth-child(4) {left: 133px;}
    .column #aboutC h3 .about span:nth-child(5) {left: 180px;}
    .column #aboutC h3 .choco span:nth-child(1) {left: 253px;}
    .column #aboutC h3 .choco span:nth-child(2) {left: 295px;}
    .column #aboutC h3 .choco span:nth-child(3) {left: 343px;}
    .column #aboutC h3 .choco span:nth-child(4) {left: 393px;}
    .column #aboutC h3 .choco span:nth-child(5) {left: 435px;}
    .column #aboutC h3 .choco span:nth-child(6) {left: 480px;}
    .column #aboutC h3 .choco span:nth-child(7) {left: 515px;}
    .column #aboutC h3 .choco span:nth-child(8) {left: 560px;}
    .column #aboutC h3 .choco span:nth-child(9) {left: 595px;}
    .column .hWrap {margin: 0 auto 100px;}
    
    
    
    /* about_sub03 */
    
    /* common */
    .about .sImg {height: 500px; margin: 100px 0 120px;}
    .about .sTxt {width: 81.79%; height: 321px; margin-bottom: 90px;}
    .about .sTxt p:first-child{width: 31.1%; font-size: 3.5rem; line-height: 4.2rem;}
    .about .sTxt p:last-child {width: 43.85%; margin-left: 15.08%; font-size: 2.5rem; line-height: 3.3rem;}
    .about #history .hisW {width: 87.7%; height: 754px;}
    .about #history .his {width: 31.84%; margin-right: 2.22%;}
    .about #history .his span {font-size: 7rem;}
    .about #history .his .yImg {height: 400px;}
    .about #history .his p {font-size: 3rem; line-height: 3.9rem;}
    

    /* #history */
    .about #history {padding-top: 176px;}
    .about #history h3 span:nth-child(2) {left: 50px;}
    .about #history h3 span:nth-child(3) {left: 75px;}
    .about #history h3 span:nth-child(4) {left: 120px;}
    .about #history h3 span:nth-child(5) {left: 160px;}
    .about #history h3 span:nth-child(6) {left: 210px;}
    .about #history h3 span:nth-child(7) {left: 255px;}
    .about #history .sImg p {font-size: 6rem; line-height: 500px;}
    .about #history .sTxt {height: 223px;}
    .about #history ul {width: 1150px;}
    .about #history ul li {width: 200px; height: 200px; margin: 0 91px 0;}
    .about #history ul li a {font-size: 3.5rem; line-height: 200px;}
    .about #history .bar {width: 16.75%; margin: 120px 0 100px 41.62%;}
    
    
    /* #aboutchef */
    .about #aboutchef ul {width: 87.7%; height: 1280px;}
    .about #aboutchef ul li {width: 46.17%; height: 600px;}
    .about #aboutchef ul li:nth-child(odd) { margin-right: 7.6%;}
    .about #aboutchef ul li:nth-child(3), .about #aboutchef ul li:nth-child(4) {margin-top: 80px;}
    .about #chocolates ul li a {height: 360px;}
    .about #aboutchef ul li a .caption {padding-top: 247px;}
    .about #aboutchef ul li a .caption p:first-child  {font-size: 3rem;}
    .about #aboutchef ul li a .caption p:last-child {font-size: 4rem; margin-top: 30px;}
    
    /* #chocolates */
    .about #chocolates {padding-top: 160px;}
    .about #chocolates h3 {height: 52px;}
    .about #chocolates .sTxt {height: 157px;}
    .about #chocolates ul {width: 87.7%; height: 1380px;}
    .about #chocolates ul li {width: 28.66%; height: 722px; margin-right: 4.6%;}
    .about #chocolates ul li a {height: 450px;}
    .about #chocolates ul li a .caption {padding-top: 211px;}
    .about #chocolates ul li a .caption span:first-child {font-size: 3.5rem;}
    .about #chocolates ul li a .caption span:last-child {font-size: 2.5rem; margin-left: 38px;}
    .about #chocolates ul li a + p {width: 95%; font-size: 2.5rem; line-height: 3.3rem; margin: 19px auto 0;}
    
    
    
     
    /* stores_sub04 */
    
    /* #godiva */
    .stores #godiva {padding-top: 204px;}
    .stores #godiva ul {width: 89.06%; height: 743px;}
    .stores #godiva ul li {width: 32.1%; margin-right: 1.78%;}
    .stores #godiva ul li:nth-child(3) {margin-top: 0; margin-right: 0;}
    .stores #godiva ul li:nth-child(4), .stores #godiva ul li:nth-child(5), .stores #godiva ul li:nth-child(6) {margin-top: 100px;}
    .stores #godiva ul li:nth-child(6) {margin-right: 0;}
    .stores #godiva ul li .caption span {line-height: 80px;}
    .stores #godiva ul li .caption span:first-of-type {margin: 0 9.63% 0 9.09%;}
    .stores #godiva ul li .caption img {right: 3.63%;}
    
    /* #internal */
    .stores #internal {padding-top: 165px;}
    .stores #internal h3 {font-size: 6rem;}
    .stores #internal ul {width: 89.06%; height: 560px; margin: 80px auto 200px;}
    .stores #internal ul li {width: 32.1%; margin-right: 1.78%;}
    .stores #internal ul li:nth-child(3) {margin-top: 0; margin-right: 0;}
    .stores #internal ul li:nth-child(4), .stores #internal ul li:nth-child(5), .stores #internal ul li:nth-child(6) {margin-top: 100px;}
    .stores #internal ul li:nth-child(6) {margin-right: 0;}
    .stores #internal ul li a {padding-left: 7.09%;}
    .stores #internal ul li a img {right: 3.63%;}
    .stores #internal ul li div {padding-left: 7.09%;}
   
}