/* CSS Document */
@charset "utf-8";

html { 
}


body {
    font-family:"メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    margin:0px auto 0px auto;
    padding:0px;
    font-size:13px;
    color:#333;
    line-height:1.5;
    min-width:1000px;
    background:#FAECE0 url(../img/uvgel/bg.png) no-repeat center top;
    background-size:100% auto;
}

a:link      { color:#333333; text-decoration: none;}
a:visited   { color:#333333; text-decoration: none;}
a:hover     { color:#FF0000; text-decoration: underline;}
a:active    { color:#FF0000; text-decoration: underline;}

img {
    border:none;
    vertical-align:bottom;
}

.clearfix {zoom:1;overflow:hidden;}
.clearfix:after {
    content: ""; 
    display: block; 
    clear: both;
}

.over{
    transition: all 0.2s ease-in 0s;
}
.over:hover{
    opacity:0.6;
}


/* header */

header{
}
h1.main_image{
    margin:0;
    padding:0;
    background:url(../img/uvgel/main_image_bg.png) no-repeat center top;
    text-align:center;
}


/* wrapper */

.wrapper{
    width:1000px;
    margin:0 auto;
    padding-bottom:40px;
    background:#FFF;
    box-shadow:0 0 2px 2px rgba(255,183,181,0.11);
}
.container{
}
h2{
    margin:0;
    padding:0;
    text-align:center;
}

.intro{
    padding-bottom:30px;
    background:url(../img/uvgel/intro/bg.jpg) no-repeat center bottom;
    border-top:7px solid #2D509E;
}
.intro h2{
    padding-top:35px;
}
.intro .sub_title{
    padding:22px 27px 0 27px;
    text-align:right;
}
.intro .inner{
    width:410px;
    margin:26px auto 0 auto;
    padding:23px;
    background:rgba(255,255,255,0.9);
    border:2px solid #2D509E;
    border-radius:10px;
}
.intro .title{
}
.intro .text{
    padding-top:10px;
    font-size:15px;
}
.intro .text span.border{
    /*text-decoration:underline #FFA64D;
    border-bottom:2px solid #FFA64D;*/
    background:url(../img/uvgel/intro/border.jpg) repeat-x center bottom 2px;
}
.intro .name{
    padding-top:17px;
    font-size:17px;
    text-align:right;
    font-weight:bold;
}

.btn{
    width:auto;
    margin:0;
    float:none;
    background:none;
    padding:27px 20px 0 20px;
    position:relative;
}
.btn .left{
    width:600px;
    float:left;
    position:relative;
}
.btn .bg{
}
.btn .left .item{
    position:absolute; top:425px; left:135px;
}
.btn .right{
    width:330px;
    padding-top:240px;
    float:right;
    position:relative;
}
.btn .right .item{
    position:absolute; top:440px; left:100px;
}
.btn .acc{
    position:absolute; top:53px; right:20px;
}

.paper{
}
.paper h2{
    padding-top:63px;
}
.paper .image{
    padding-top:15px;
    text-align:center;
}

.approach{
}
.approach h2{
    padding-top:60px;
}
.approach .image{
    padding-top:55px;
    text-align:center;
}

.ease{
    background:#FAF5E9;
}
.ease .image{
    padding:57px 0 26px 0;
    text-align:center;
}

.reason{
}
.reason .wrap{
    padding:26px 35px 55px 35px;
    background:url(../img/uvgel/reason/bg.jpg) repeat;
}
.reason h2{
}
.reason .box{
    padding-top:5px;
}
.reason .item{
    margin-top:20px;
    padding:50px 30px 30px 30px;
    background:#FFF;
    box-shadow:0 0 2px 2px rgba(250,236,224,0.32);
    position:relative;
}
.reason .number{
    position:absolute; top:18px; left:15px;
}
.reason .title{
    padding-left:110px;
    font-size:30px;
    color:#F6578C;
    font-weight:bold;
}
.reason .inner{
    padding-top:40px;
}
.reason .thum{
    width:300px;
    float:left;
}
.reason .text{
    padding-top:40px;
    font-size:17px;
}
.reason .text strong{
    color:#F6578C;
}
.reason .inner .text{
    width:550px;
    padding-top:9px;
    float:right;
}
.reason .image{
    padding-top:9px;
    text-align:center;
}
.reason .triangle{
    text-align:center;
}

.check{
    padding-top:26px;
}
.check h2{
}
.check .wrap{
    margin-top:30px;
    padding:30px 20px;
    background:url(../img/uvgel/check/bg.jpg) no-repeat center;
    background-size:100% 100%;
}
.check .box{
    padding:45px 35px 35px 100px;
    background:rgba(255,255,255,0.85);
    border-radius:10px;
    position:relative;
}
.check .acc{
    position:absolute; top:20px; left:29px;
}
.check .title{
    padding-left:30px;
    font-size:30px;
    color:#1F1F1F;
    font-weight:bold;
    text-shadow:2px 2px #FEE906,-2px 2px #FEE906,2px -2px #FEE906,-2px -2px #FEE906;
}
.check .inner{
    padding-top:10px;
}
.check .item{
    padding-top:10px;
}
.check .icon{
    width:43px;
    float:left;
}
.check .text{
    width:770px;
    padding-top:8px;
    float:right;
    font-size:27px;
    color:#1F1F1F;
    font-weight:bold;
}

.uv{
    padding:38px 0 40px 0;
}
.uv .inner{
    position:relative;
}
.uv .title{
    text-align:center;
}
.uv .text{
    width:100%;
    position:absolute; top:145px; left:0;
    font-size:25px;
    color:#1F1F1F;
    text-align:center;
}
.uv .image{
    margin-top:-28px;
    position:relative;
    z-index:10;
    text-align:center;
}

.care{
    background:#FCFAE4;
}
.care .image{
    padding-top:58px;
    text-align:center;
}

.which{
    background:url(../img/uvgel/which/bg.jpg) no-repeat center top 73px;
}
.which .image{
    padding:23px 0 0 148px;
}
.which .papar_image{
    padding-top:10px;
    text-align:center;
}

.child{
    padding:16px 0 0 32px;
    position:relative;
}
.child .image{
}
.child .text{
    width:600px;
    position:absolute; top:303px; left:358px;
    font-size:20px;
}

.fit{
    padding:133px 25px 37px 25px;
    background:url(../img/uvgel/fit/bg.jpg) repeat;
    position:relative;
}
.fit h2{
    position:absolute; top:-18px; left:90px;
}
.fit .inner{
}
.fit .item{
    width:300px;
    margin-right:25px;
    float:left;
    background:#FFF;
}
.fit .inner .item:last-child{
    margin-right:0;
}
.fit .thum{
}
.fit .text{
    padding:24px 0;
    font-size:17px;
    text-align:center;
}
.fit .text span{
    color:#F6578C;
}
.fit .bottom{
    margin-top:20px;
    padding:16px;
    background:#FFF;
    border-radius:10px;
    font-size:28px;
    color:#F6578C;
    font-weight:bold;
    text-align:center;
}

.popular{
    border-top:5px solid #2E509E;
}
.popular .wrap{
    padding:33px 35px 47px 35px;
    background:url(../img/uvgel/popular/bg.jpg) repeat-y center;
    background-size:100% auto;
    position:relative;
}
.popular h2{
}
.popular .acc{
    position:absolute; top:-31px; right:92px;
}
.popular .box{
    padding-top:30px;
}
.popular .thum{
    width:300px;
    float:left;
}
.popular .inner{
    width:550px;
    padding:22px 23px 17px 23px;
    background:rgba(255,255,255,0.9);
    border:2px solid #2E509E;
    border-radius:10px;
    float:right;
}
.popular .title{
}
.popular .image{
    padding-top:15px;
    text-align:center;
}
.popular .text{
    padding-top:15px;
    font-size:15px;
}
.popular .name{
    padding-top:20px;
    font-size:15px;
    text-align:right;
}
.popular .triangle{
    text-align:center;
}

.media{
    padding:28px 0 120px 0;
    background:url(../img/uvgel/media/bg.jpg) no-repeat center top 105px;
    background-size:100% auto;
}
.media h2{
}
.media .image{
    padding-top:52px;
    text-align:center;
}

.voice{
    padding:40px 30px 32px 30px;
    background:url(../img/uvgel/voice/bg.jpg) repeat-y center;
    background-size:100% auto;
    border-top:5px solid #F6578C;
}
.voice .inner{
    padding-top:10px;
}
.voice .item{
    margin-top:20px;
    padding:25px 25px 25px 35px;
    background:#FFF;
    border:1px solid #F6578C;
    position:relative;
}
.voice .inner .item:last-child{
    padding:25px 35px 25px 25px;
}
.voice .detail{
    width:600px;
    padding-top:25px;
    float:left;
}
.voice .inner .item:last-child .detail{
    float:right;
}
.voice .title{
}
.voice .name{
    padding-top:15px;
    font-size:18px;
}
.voice .text{
    padding-top:14px;
    font-size:17px;
}
.voice .text span{
    color:#FF9A39;
}
.voice .thum{
    width:260px;
    float:right;
}
.voice .inner .item:last-child .thum{
    float:left;
}
.voice .comment{
    padding-top:13px;
    position:relative;
}
.voice .balloon{
    width:400px;
    padding:15px;
    background:#FFF4D5;
    border-radius:10px;
    position:relative;
}
.voice .comment .title{
    font-size:18px;
    color:#D6303D;
    font-weight:bold;
    text-align:center;
}
.voice .comment .text{
    padding-top:5px;
    font-size:17px;
}
.voice .acc{
    position:absolute; bottom:22px; right:-20px;
}
.voice .comment .thum{
    width:auto;
    float:none;
    position:absolute; top:21px; right:-20px;
}
.voice .caution{
    padding-top:35px;
    font-size:15px;
    text-align:right;
}

.qa{
    padding:59px 22px 10px 22px;
}
.qa .box{
}
.qa .item{
    margin-top:20px;
    padding:16px 18px;
    border:1px solid #DDD;
    outline:2px solid #F5F5F5;
}
.qa .inner{
    font-size:0;
}
.qa .icon{
    width:40px;
    background:#F6578C;
    border-radius:20px;
    display:inline-block;
    vertical-align:top;
    font-size:20px;
    color:#FFF;
    line-height:40px;
    text-align:center;
}
.qa .title{
    width:868px;
    padding:10px 0 0 10px;
    display:inline-block;
    vertical-align:top;
    font-size:15px;
    color:#F6578C;
}
.qa .text{
    padding:11px 5px 0 5px;
    font-size:15px;
    color:#444;
}

.about{
    padding:32px 20px 0 20px;
}
.about .item{
    padding-top:20px;
}
.about .title{
    padding:10px 15px;
    background:#999;
    font-size:15px;
    color:#FFF;
    font-weight:bold;
}
.about .text{
    padding:20px 10px 0 10px;
    font-size:15px;
    color:#444;
}


/* footer */

footer{
    background:#2E509E;
}
.top_marker{
    position:fixed; bottom:150px; right:0;
}
footer .inner{
    width:1000px;
    margin:0 auto;
    padding:30px 0 25px 0;
}
footer .logo{
    width:372px;
    padding-left:22px;
    float:left;
}
footer nav{
    width:584px;
    padding:9px 0 0 22px;
    float:left;
    display:block;
    font-size:15px;
    color:#FFF;
}
footer nav a{
    color:#FFF !important;
}
.copyright{
    padding:3px 0;
    background:#264282;
    font-size:11px;
    color:#FFF;
    text-align:center;
}


/* font */

.blue { color:#0000FF;}
.deep_blue{color:#2C509E;}
.red { color:#FF0000;}
.deep_red{ color:#D80000;}
.orange{ color:#F89206;}



/* lp */

div#container{
    width:100%;
    margin:0;
    padding:0;
    background:none;
}
body{
    letter-spacing:normal;
}
#lpshoppingcolumn {
width: 92%;
margin: 15px auto 0 auto;
padding: 2%;
font-size: 1em;
border: 2px solid #aaa;
border-radius: 5px;
overflow: hidden;
}

.form_title{
    width: 92%;
    margin: 30px auto 0 auto;
    padding:10px 2%;
    background:#999;
    font-size:15px;
    color:#FFF;
    font-weight:bold;
}

.form_thum_box{
    width: 92%;
    margin: 15px auto 0 auto;
    font-size:0;
}
.form_thum_box .thum{
    width:15%;
    display:inline-block;
    vertical-align:middle;
}
.form_thum_box .thum img{
    width:100%;
}
.form_thum_box .name{
    width:83%;
    padding-left:2%;
    display:inline-block;
    vertical-align:middle;
    font-size:24px;
    color:#333;
    line-height:1.5;
}
.form_thum_box .name span{
    font-size:15px;
}