/*-----Reset------*/
#lipstick_contents { margin: 0 auto; max-width: 1256px; width: 100%; position: relative; }
#lipstick_contents h1 { margin-top: 0 !important;}
#social-wrap { position: absolute; right: 0; top: 15px; overflow: hidden; z-index: 9; }
#social-wrap a.fb { background-position: 0 0; }
#social-wrap a.tw { background-position: -36px 0; }
#social-wrap a { display: block; width: 36px; height: 36px; background: url(../img/social_bt.png) no-repeat left top; margin: 0 10px 0 0; float: left; text-indent: -9999px; opacity: 0; }

a.online { display: block; width: 640px; height: 225px; margin: 0 auto; background: #000 !important; box-shadow: 10px 10px 0 #ececec; text-decoration: none; text-align: center; transition: transform 0.2s ease-in-out; margin-bottom: 160px; }


/*sec01*/
#sec01 { width: 100%; height: 580px; background: #f9f9f9; margin: 0 auto; opacity: 0; position: relative; text-align: center; }
#sec01 h1 { padding: 140px 0; }
#sec01 h1 img { margin: 0 auto; }

/*sec02*/
#sec02 { position: relative; width: 1256px; height: auto; margin: 0 auto; transition: .8s; transition-delay: .8s; background: #fff; text-align: center; }
#sec02 h1 { padding: 140px 0; }
#sec02 h1 img { margin: 0 auto; }
#sec02 ul { list-style: none; margin: 0 auto; }
#sec02 ul li { transition: .8s; transition-delay: .8s; opacity: 0; }
#sec02 ul li img { margin-left: auto; margin-right: auto; }
#sec02 ul li:nth-child(1) img { margin-bottom: 80px; }
#sec02 ul li:nth-child(2) img { margin-bottom: 80px; }
#sec02 ul li:nth-child(3) img { margin-bottom: 180px; margin: 0 auto; transition: .8s; transition-delay: .8s; padding-top: 80px; }
#sec02 ul li:nth-child(4) img { margin-bottom: 180px; }
#sec02 ul li:nth-child(5) img { margin-bottom: 150px; }
#sec02 ul li:nth-child(6) img { margin-bottom: 180px; }

/*sec03*/
#sec03 { text-align: center; padding: 140px 0; background: #f9f9f9; }
#sec03 * { margin: 0 auto; }
#sec03 div { padding: 90px 0 0}

/*sec04*/
#sec04 { text-align: center; padding: 140px 0; background: #ffffff; }
#sec04 * { margin: 0 auto; }
#sec04 div { padding: 90px 0 0}
#sec04 ul li:nth-child(1) img { margin-bottom: 20px; padding-top: 80px; }
#sec04 ul li:nth-child(2) img { margin-bottom: 60px; }
#sec04 ul li:nth-child(3) img { margin-bottom: 180px; margin: 0 auto; transition: .8s; transition-delay: .8s; padding-top: 80px; }



@media screen and (max-width: 768px){

.spOnly{display: inline-block;}
.pcOnly{display: none;}
a.online { width: 70% ; height: auto; margin: 0 auto;}

#lipstick_contents { max-width: 100%; }

#sec01 { height: auto;}
#sec01 h1 { padding: 90px 20px 60px; }

#sec02  {width: 100%; padding: 20px 0; }
#sec02 h1 { padding: 0; margin: 0 0 50px; }
#sec02 h1 img  { padding: 0 20px; }
#sec02 ul li:nth-child(1) img { padding: 0 20px; margin: 0;}
#sec02 ul li:nth-child(2) img { padding: 0 20px; margin: 40px 0;}
#sec02 ul li:nth-child(3) img { padding: 30px; margin: 0;}
#sec02 ul li:nth-child(4) img { margin: 60px 0;}
#sec02 ul li:nth-child(5) img { padding: 0 20px; margin: 0 0 40px;}
#sec02 ul li:nth-child(6) img { padding: 0 20px; margin: 0 0 80px;}

#sec03 { width: 100%; padding: 60px 20px;}
#sec03 div { padding: 40px 0 0;}
#sec03 iframe{ width: 100%; height: auto;}

#sec04 { padding: 60px 0;}
#sec04 ul li:nth-child(1) img { padding: 30px; margin: 0;}

}