/*
 *Landing page Template | IQ-Designer v1.00 
 *Copyright (C) 2008-2015 infosmile Inc. All Rights Reserved.
 */

/*
v(^^)v━━━━━━━━━━━━━━━━━━━v(^^)v

↓ドロップシャドウボックス

v(^^)v━━━━━━━━━━━━━━━━━━━v(^^)v 
*/
/*** 共通 ***/

.box-inner{
margin: 0px 30px;
padding:30px 0px;
color: #333333;
outline: none;
}

.box-inner2{
margin: 0px 20px;
padding:15px 0px;
color: #333333;
outline: none;
}

/*** BOX 1 ***/

.box1{
	min-height: 200px;
    width: 100%;
    position:relative;
    display: inline-block;
    background:#fff;
    background: -webkit-gradient(linear, 0% 20%, 0% 1000%, from(#fff), to(#fff), color-stop(.1,#f3f3f3));
    background: -moz-linear-gradient(0% 0%, #fff, #f3f3f3 10%, #fff);
    border: 1px solid #ccc;
    -webkit-box-shadow: 0px 3px 30px rgba(0, 0, 0, 0.1) inset;
    -moz-box-shadow: 0px 3px 30px rgba(0, 0, 0, 0.1) inset;
    box-shadow: 0px 3px 30px rgba(0, 0, 0, 0.1) inset;
    -webkit-border-bottom-right-radius: 6px 50px;
    -moz-border-radius-bottomright: 6px 50px;
    border-bottom-right-radius:6px 50px;
}
 
.box1:before{
    content: '';
    width: 50px;
    height: 100px;
    position:absolute;
    bottom:0; right:0;
    -webkit-box-shadow: 20px 20px 10px rgba(0, 0, 0, 0.1);
    -moz-box-shadow: 20px 20px 15px rgba(0, 0, 0, 0.1);
    box-shadow: 20px 20px 15px rgba(0, 0, 0, 0.1);
    z-index:-1;
    -webkit-transform: translate(-35px,-40px)
                        skew(0deg,30deg)
                        rotate(-25deg);
    -moz-transform: translate(-35px,-40px)
                        skew(0deg,32deg)
                        rotate(-25deg);
    -o-transform: translate(-35px,-40px)
                        skew(0deg,32deg)
                        rotate(-25deg);
}
 
.box1:after{
    content: '';
    width: 100px;
    height: 100px;
    top:0; left:0;
    position:absolute;
    display: inline-block;
    z-index:-1;
    -webkit-box-shadow: -10px -10px 10px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: -10px -10px 15px rgba(0, 0, 0, 0.2);
    box-shadow: -10px -10px 15px rgba(0, 0, 0, 0.2);
    -webkit-transform: rotate(2deg)
                        translate(20px,25px)
                        skew(20deg);
    -moz-transform: rotate(7deg)
                        translate(20px,25px)
                        skew(20deg);
    -o-transform: rotate(7deg)
                        translate(20px,25px)
                        skew(20deg);
        transform: rotate(7deg)
                        translate(20px,25px)
                        skew(20deg);
}


/*** BOX 2 ***/

.box2{
    width: 100%;
	min-height: 150px;
    padding: 0 0 1px 0;
    position:relative;
    background: #f3f3f3;
    background: -webkit-gradient(linear, 0% 20%, 0% 92%, from(#f3f3f3), to(#fff), color-stop(.1,#f3f3f3));
    background: -moz-linear-gradient(0 0 270deg, #f3f3f3, #f3f3f3 10%, #fff);
    border-top: 1px solid #ccc;
    border-right: 1px solid #ccc;
    -webkit-border-bottom-right-radius: 60px 60px;
    -moz-border-radius-bottomright: 60px 60px;
    border-bottom-right-radius: 60px 60px;
    -webkit-box-shadow: -1px 2px 2px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: -1px 2px 2px rgba(0, 0, 0, 0.2);
    box-shadow: -1px 2px 2px rgba(0, 0, 0, 0.2);
 
}
.box2:before{
    content:'';
    width: 25px;
    height: 20px;
    position: absolute;
    bottom:0;
    right:0;
    -webkit-border-bottom-right-radius: 30px;
    -moz-border-radius-bottomright: 30px;
    border-bottom-right-radius: 30px;
    -webkit-box-shadow: -2px -2px 5px rgba(0, 0, 0, 0.3);
    -moz-box-shadow: -2px -2px 5px rgba(0, 0, 0, 0.3);
    box-shadow:-2px -2px 5px rgba(0, 0, 0, 0.3);
    -webkit-transform:  rotate(-20deg)
                        skew(-40deg,-3deg)
                        translate(-13px,-13px);
    -moz-transform: rotate(-20deg)
                    skew(-40deg,-3deg)
                    translate(-13px,-13px);
    -o-transform:   rotate(-20deg)
                    skew(-40deg,-3deg)
                    translate(-13px,-13px);
                    transform:
                    rotate(-20deg)
                    skew(-40deg,-3deg)
                    translate(-13px,-13px);
}
 
.box2:after{
    content: '';
    z-index: -1;
    width: 100px;
    height: 100px;
    position:absolute;
    bottom:0;
    right:0;
    background: rgba(0, 0, 0, 0.2);
    display: inline-block;
    -webkit-box-shadow: 20px 20px 8px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 20px 20px 18px rgba(0, 0, 0, 0.2);
    box-shadow: 20px 20px 8px rgba()0,0,0,0.2;
    -webkit-transform: rotate(0deg)
                        translate(-45px,-20px)
                        skew(20deg);
    -moz-transform: rotate(0deg)
                    translate(-45px,-20px)
                       skew(20deg);
    -o-transform: rotate(0deg)
                    translate(-45px,-20px)
                       skew(20deg);
    transform: rotate(0deg)
                translate(-45px,-20px)
                skew(20deg);
}


/*** BOX 3 ***/

.box3{
    width: 100%;
    padding: 5px 0 ;
    position:relative;
    background:#fff;
    background: -webkit-gradient(linear, 0% 20%, 0% 92%, from(#fff), to(#f3f3f3), color-stop(.1,#fff));
    border: 1px solid #ccc;
    -webkit-border-radius: 60px 5px;
    -moz-border-radius: 60px/5px;
    border-radius:60px/5px;
    -webkit-box-shadow: 0px 0px 35px rgba(0, 0, 0, 0.1) inset;
    -moz-box-shadow: 0px 0px 35px rgba(0, 0, 0, 0.1) inset;
    box-shadow: 0px 0px 35px rgba(0, 0, 0, 0.1) inset;
}
 
.box3:before{
    content: '';
    width: 50px;
    height: 50px;
    top:0; right:0;
    position:absolute;
    display: inline-block;
    z-index:-1;
    -webkit-box-shadow: 10px -10px 8px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 10px -10px 8px rgba(0, 0, 0, 0.2);
    -webkit-transform: rotate(2deg)
                        translate(-14px,20px)
                        skew(-20deg);
    -moz-transform: rotate(2deg)
                        translate(-14px,20px)
                        skew(-20deg);
    -o-transform: rotate(2deg)
                        translate(-14px,20px)
                        skew(-20deg);
    transform: rotate(2deg)
                        translate(-14px,20px)
                        skew(-20deg);
}
 
.box3:after{
    content: '';
    width: 100px;
    height: 100px;
    top:0; left:0;
    position:absolute;
    z-index:-1;
    display: inline-block;
    -webkit-box-shadow: -10px -10px 10px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: -10px -10px 10px rgba(0, 0, 0, 0.2);
    -webkit-transform: rotate(2deg)
                        translate(20px,25px)
                        skew(20deg);
    -moz-transform: rotate(2deg)
                        translate(20px,25px)
                        skew(20deg);
    -o-transform: rotate(2deg)
                        translate(20px,25px)
                        skew(20deg);
    transform: rotate(2deg)
               translate(20px,25px)
               skew(20deg);
}


/*** BOX 4 ***/

.box4{
    width: 100%;
	min-height: 100px;
    padding: 5px 0 ;
    position:relative;
    background: #fff;
    background: -webkit-gradient(linear, 0% 20%, 0% 100%, from(#fff), to(#fff), color-stop(.2, #f2f2f2));
    background: -moz-linear-gradient(0% 0% 360deg, #fff, #f2f2f2 20%, #fff );
    border: 1px solid #ccc;
    -webkit-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.3);
    -moz-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.3);
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.3);
}
 
.box4:before{
    content: '';
    width: 50px;
    height: 50px;
    top:0; right:0;
    position:absolute;
    z-index: -1;
    -webkit-box-shadow: 10px -10px 8px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 10px -10px 8px rgba(0, 0, 0, 0.2);
    box-shadow: 10px -10px 8px rgba(0, 0, 0, 0.2);
    -webkit-transform: rotate(2deg)
                        translate(-14px,20px)
                        skew(-20deg);
    -moz-transform: rotate(2deg)
                        translate(-14px,20px)
                        skew(-20deg);
        -o-transform: rotate(2deg)
                        translate(-14px,20px)
                        skew(-20deg);
                transform: rotate(2deg)
                        translate(-14px,20px)
                        skew(-20deg);
}
 
.box4:after{
    content: '';
    width: 50px;
    height: 50px;
    top:0; left:0;
    position:absolute;
    z-index:-1;
    display: inline-block;
    -webkit-box-shadow: -10px -10px 10px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: -10px -10px 10px rgba(0, 0, 0, 0.2);
    box-shadow: -10px -10px 10px rgba(0, 0, 0, 0.2);
    -webkit-transform: rotate(2deg)
                        translate(12px,25px)
                        skew(20deg);
    -moz-transform: rotate(2deg)
                        translate(12px,25px)
                        skew(20deg);
    -o-transform: rotate(2deg)
                        translate(12px,25px)
                        skew(20deg);
    transform: rotate(2deg)
                        translate(12px,25px)
                        skew(20deg);
}
 
.shr_box4{
    width: 100px;
    height: 100px;
    bottom:0; right:0;
    position:absolute;
    z-index: -1;
    -webkit-box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.2);
    box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.2);
    -webkit-transform: rotate(0deg)
                        translate(-20px,-15px)
                       skew(20deg);
    -moz-transform: rotate(0deg)
                        translate(-20px,-15px)
                       skew(20deg);
    -o-transform: rotate(0deg)
                        translate(-20px,-15px)
                       skew(20deg);
        transform: rotate(0deg)
                        translate(-20px,-15px)
                       skew(20deg);
}
 
.shl_box4{
    content: '';
    width: 100px;
    height: 100px;
    bottom:0; left:0;
    position:absolute;
    z-index: -1;
    -webkit-box-shadow: -10px 10px 10px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: -10px 10px 10px rgba(0, 0, 0, 0.2);
    box-shadow: -10px 10px 10px rgba(0, 0, 0, 0.2);
    -webkit-transform: rotate(0deg)
                        translate(20px,-15px)
                       skew(-20deg);
    -moz-transform: rotate(0deg)
                        translate(20px,-15px)
                       skew(-20deg);
    -o-transform: rotate(0deg)
                        translate(20px,-15px)
                       skew(-20deg);
    transform: rotate(0deg)
                        translate(20px,-15px)
                       skew(-20deg);
}

/*** BOX 5 ***/

.box5{
    width: 100%;
	min-height: 150px;
    padding: 0 0 1px 0;
    position:relative;
    background: #f3f3f3;
    background: -webkit-gradient(linear, 0% 20%, 0% 92%, from(#f3f3f3), to(#fff), color-stop(.1,#f3f3f3));
    background: -moz-linear-gradient(0 0 270deg, #f3f3f3, #f3f3f3 10%, #fff);
    border-top: 1px solid #ccc;
    border-right: 1px solid #ccc;
    -webkit-border-bottom-right-radius: 60px 60px;
    -webkit-border-bottom-left-radius: 60px 60px;
    -moz-border-radius-bottomright: 60px 60px;
    -moz-border-radius-bottomleft: 60px 60px;
    border-bottom-left-radius:60px 60px;
    border-bottom-right-radius: 60px 60px;
    -webkit-box-shadow: -1px 2px 2px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: -1px 2px 2px rgba(0, 0, 0, 0.2);
    box-shadow: -1px 2px 2px rgba(0, 0, 0, 0.2);
}
 
.box5:before{
    content:'';
    width: 25px;
    height: 20px;
    background: white;
    position: absolute;
    bottom:0; right:0;
    background: -webkit-gradient(linear, 0% 20%, 50% 40%, from(#fff), to( #eee), color-stop(.1,#fff));
    background: -moz-linear-gradient(0 50% 90deg, #fff, #fff 10%, #eee);
    -webkit-border-bottom-right-radius: 30px;
    -moz-border-radius-bottomright: 30px;
    border-bottom-right-radius: 30px;
    -webkit-box-shadow: -2px -2px 5px rgba(0, 0, 0, 0.3);
    -moz-box-shadow: -2px -2px 5px rgba(0, 0, 0, 0.3);
    box-shadow: -2px -2px 5px rgba(0, 0, 0, 0.3);
    -webkit-transform: rotate(-20deg)
                        skew(-40deg,-3deg)
                        translate(-13px,-13px);
    -moz-transform: rotate(-20deg)
                        skew(-40deg,-3deg)
                        translate(-13px,-13px);
    -o-transform: rotate(-20deg)
                        skew(-40deg,-3deg)
                        translate(-13px,-13px);
        transform: rotate(-20deg)
                        skew(-40deg,-3deg)
                        translate(-13px,-13px);
}
 
.box5:after{
    content: '';
    z-index: -10;
    width: 100px;
    height: 100px;
    position:absolute;
    bottom:0;
    right:0;
    background: rgba(0, 0, 0, 0.2);
    display: inline-block;
    -webkit-box-shadow: 20px 20px 8px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 20px 20px 18px rgba(0, 0, 0, 0.2);
    box-shadow: 20px 20px 8px rgba(0, 0, 0, 0.2);
    -webkit-transform: rotate(0deg)
                        translate(-45px,-20px)
                        skew(20deg);
    -moz-transform: rotate(0deg)
                        translate(-45px,-20px)
                        skew(20deg);
        -o-transform: rotate(0deg)
                        translate(-45px,-20px)
                        skew(20deg);
        transform: rotate(0deg)
                        translate(-45px,-20px)
                        skew(20deg);
}
 
.fold_box5{
    z-index: -10;
    width: 50px;
    height: 50px;
    position:absolute;
    bottom:0; left:0;
    -webkit-box-shadow: -20px 20px 8px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: -20px 20px 18px rgba(0, 0, 0, 0.2);
    box-shadow: -20px 20px 8px rgba(0, 0, 0, 0.2);
    -webkit-transform: rotate(0deg)
                        translate(40px,-20px)
                        skew(-20deg);
    -moz-transform: rotate(0deg)
                        translate(40px,-20px)
                        skew(-20deg);
    -o-transform: rotate(0deg)
                        translate(40px,-20px)
                        skew(-20deg);
    transform: rotate(0deg)
                        translate(40px,-20px)
                        skew(-20deg);
}
 
.fold2_box5{
    content:'';
    width: 25px;
    height: 20px;
    background: white;
    position: absolute;
    bottom:0; left:0;
    background: #fff;
    background: -webkit-gradient(linear, 0% 20%, 50% 80%, from(#fff), to( #eee), color-stop(.1,#fff));
    background: -moz-linear-gradient(0 50%, #fff, #fff 10%, #eee);
    -webkit-border-bottom-right-radius: 30px;
    -moz-border-radius-bottomright: 30px;
    border-bottom-right-radius: 30px;
    -webkit-box-shadow: -2px -2px 5px rgba(0, 0, 0, 0.3);
    -moz-box-shadow: -2px -2px 5px rgba(0, 0, 0, 0.3);
    box-shadow: -2px -2px 5px rgba(0, 0, 0, 0.3);
    -webkit-transform: rotate(103deg)
                        skew(-3deg,-40deg)
                        translate(-13px,-15px);
    -moz-transform: rotate(103deg)
                        skew(-3deg,-40deg)
                        translate(-13px,-15px);
    -o-transform: rotate(103deg)
                        skew(-3deg,-40deg)
                        translate(-13px,-15px);
}

/*** BOX 6***/

.box6{
    width: 100%;
	min-height: 150px;
    padding: 0 0 1px 0;
    position:relative;
    background:#fff;
    background: -webkit-gradient(linear, 0% 20%, 0% 92%, from(#fff), to(#f3f3f3), color-stop(.1,#fff));
    background: -moz-linear-gradient(0 0 270deg, #fff, #fff 10%, #f3f3f3);
    border-top: 1px solid #ccc;
    border-right: 1px solid #ccc;
    border-left: 1px solid #ccc;
    -webkit-border-top-left-radius: 60px 5px;
    -webkit-border-top-right-radius: 60px 5px;
    -webkit-border-bottom-right-radius: 60px 60px;
    -moz-border-radius-topleft: 60px 5px;
    -moz-border-radius-topright: 60px 5px;
    -moz-border-radius-bottomright: 60px 60px;
    border-top-left-radius: 60px 5px;
    border-top-right-radius: 60px 5px;
    border-bottom-right-radius: 60px 60px;
    -webkit-box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.3) ;
    -moz-box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.3) ;
    box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.3) ;
}
 
.box6:before{
    content:'';
    width: 25px;
    height: 20px;
    position: absolute;
    bottom:0;
    right:0;
    -webkit-border-bottom-right-radius: 30px;
    -moz-border-radius-bottomright: 30px;
    border-bottom-right-radius: 30px;
    -webkit-box-shadow: -2px -2px 5px rgba(0, 0, 0, 0.3);
    -moz-box-shadow: -2px -2px 5px rgba(0, 0, 0, 0.3);
    box-shadow: -2px -2px 5px rgba(0, 0, 0, 0.3);
    -webkit-transform:  rotate(-20deg)
                        skew(-40deg,-3deg)
                        translate(-13px,-13px);
    -moz-transform: rotate(-20deg)
                        skew(-40deg,-3deg)
                        translate(-13px,-13px);
    -o-transform:   rotate(-20deg)
                        skew(-40deg,-3deg)
                        translate(-13px,-13px);
    transform:  rotate(-20deg)
                        skew(-40deg,-3deg)
                        translate(-13px,-13px);
}
 
.box6:after{
    content: '';
    z-index: -10;
    width: 100px;
    height: 100px;
    position:absolute;
    bottom:0;
    right:0;
    background: rgba(0, 0, 0, 0.2);
    display: inline-block;
    -webkit-box-shadow: 20px 20px 8px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 20px 20px 8px rgba(0, 0, 0, 0.2);
    box-shadow: 20px 20px 8px rgba(0, 0, 0, 0.2);
    -webkit-transform: rotate(0deg)
                        translate(-45px,-20px)
                        skew(20deg);
    -moz-transform: rotate(0deg)
                        translate(-45px,-20px)
                        skew(20deg);
    -o-transform: rotate(0deg)
                        translate(-45px,-20px)
                        skew(20deg);
    transform: rotate(0deg)
                        translate(-45px,-20px)
                        skew(20deg);
}
 
.box6_corner_lf{
    width: 100px;
    height: 100px;
    top:0; left:0;
    position:absolute;
    z-index:-6;
    display: inline-block;
    -webkit-box-shadow: -10px -10px 10px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: -10px -10px 10px rgba(0, 0, 0, 0.2);
    box-shadow: -10px -10px 20px rgba(0, 0, 0, 0.2);
    -webkit-transform: rotate(2deg)
                        translate(20px,25px)
                        skew(20deg);
    -moz-transform: rotate(2deg)
                        translate(20px,20px)
                        skew(20deg);
    -o-transform: rotate(2deg)
                        translate(20px,20px)
                        skew(20deg);
    transform: rotate(2deg)
                        translate(20px,20px)
                        skew(20deg);
}
 
.box6_corner_rt{
    content: '';
    width: 50px;
    height: 50px;
    top:0; right:0;
    position:absolute;
    display: inline-block;
    z-index:-6;
    -webkit-box-shadow: 10px -10px 8px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 10px -10px 18px rgba(0, 0, 0, 0.2);
    box-shadow: 10px -10px 8px rgba(0, 0, 0, 0.2);
    -webkit-transform: rotate(2deg)
                        translate(-14px,20px)
                        skew(-20deg);
    -moz-transform: rotate(2deg)
                        translate(-14px,15px)
                        skew(-20deg);
    -o-transform: rotate(2deg)
                        translate(-14px,15px)
                        skew(-20deg);
    transform: rotate(2deg)
                        translate(-14px,15px)
                        skew(-20deg);
}

/*** BOX 7 ***/

.box7{
    width: 100%;
	min-height: 150px;
    padding: 0 0 1px 0;
    position:relative;
    background: #fff;
    background: -webkit-gradient(linear, 0% 20%, 0% 92%, from(#fff), to(#f3f3f3), color-stop(.1,#fff));
    background: -moz-linear-gradient(0 0 270deg, #fff, #fff 10%, #f3f3f3);
    border-top: 1px solid #ccc;
    border-right: 1px solid #ccc;
    border-left: 1px solid #ccc;
    -webkit-box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.2);
    box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.2);
}
 
.box7:before{
    content: '';
    position:absolute;
    width: 130px;
    height: 30px;
	z-index:2;
    border-left: 1px dashed rgba(0, 0, 0, 0.1);
    border-right: 1px dashed rgba(0, 0, 0, 0.1);
    background: rgba(0, 0, 0, 0.1);
    background: -webkit-gradient(linear, 555% 20%, 0% 92%, from(rgba(0, 0, 0, 0.1)), to(rgba(0, 0, 0, 0.0)), color-stop(.1,rgba(0, 0, 0, 0.2)));
    background: -moz-linear-gradient(555% 0 180deg, rgba(0,0,0,0.1), rgba(0,0,0,0.2) 10%, rgba(0,0,0,0.0));
    -webkit-box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.2);
    box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.2);
    -webkit-transform:translate(-50px,10px)
                        skew(10deg,10deg)
                        rotate(-50deg);
    -moz-transform:translate(-50px,10px)
                        skew(10deg,10deg)
                        rotate(-50deg);
        -o-transform:translate(-50px,10px)
                        skew(10deg,10deg)
                        rotate(-50deg);
        transform:translate(-50px,10px)
                        skew(10deg,10deg)
                        rotate(-50deg);
}
 
.box7:after{
    content: '';
    position:absolute;
    right:0;
    bottom:0;
	z-index:2;
    width: 130px;
    height: 30px;
    background: rgba(0, 0, 0, 0.1);
    background: -webkit-gradient(linear, 555% 20%, 0% 92%, from(rgba(0, 0, 0, 0.1)), to(rgba(0, 0, 0, 0.0)), color-stop(.1,rgba(0, 0, 0, 0.2)));
    background: -moz-linear-gradient(555% 0 180deg, rgba(0,0,0,0.1), rgba(0,0,0,0.2) 10%, rgba(0,0,0,0.0));
    border-left: 1px dashed rgba(0, 0, 0, 0.1);
    border-right: 1px dashed rgba(0, 0, 0, 0.1);
    -webkit-box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.2);
    box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.2);
    -webkit-transform: translate(50px,-20px)
                        skew(10deg,10deg)
                        rotate(-50deg);

    -moz-transform: translate(50px,-20px)
                        skew(10deg,10deg)
                        rotate(-50deg);
    -o-transform: translate(50px,-20px)
                        skew(10deg,10deg)
                        rotate(-50deg);
    transform: translate(50px,-20px)
                        skew(10deg,10deg)
                        rotate(-50deg)
}




/*** BOX 8 ***/

.box8{
    width: 100%;
	min-height: 150px;
    padding: 0 0 1px 0;
    position:relative;
    background: #fff;
    background: -webkit-gradient(linear, 100% 100%, 50% 10%, from(#fff), to(#f3f3f3), color-stop(.1,#fff));
    background: -moz-linear-gradient(100% 50%, #fff, #fff 10%, #f3f3f3);
    border: 1px solid #ccc;
    -webkit-box-shadow: 1px 1px 4px rgba(0,0,0, 0.1);
    -moz-box-shadow: 1px 1px 4px rgba(0,0,0, 0.1);
    box-shadow: 1px 1px 4px rgba(0,0,0, 0.1);
    -webkit-border-bottom-right-radius: 60px 5px;
    -moz-border-radius-bottomright: 60px 5px;
    border-bottom-right-radius: 60px 5px;
}
 
.box8:before{
    content: '';
    width: 98%;
    z-index:-1;
    height: 100%;
    padding: 0 0 1px 0;
    position: absolute;
    bottom:0; right:0;
    background: #fff;
    background: -webkit-gradient(linear, 0% 20%, 0% 92%, from(#fff), to(#f9f9f9), color-stop(.1,#fff));
    background: -moz-linear-gradient(0 0 270deg, #fff, #fff 10%, #f9f9f9);
    border: 1px solid #ccc;
    -webkit-box-shadow: 1px 1px 8px rgba(0,0,0, 0.1);
    -moz-box-shadow: 1px 1px 8px rgba(0,0,0,0.1);
    box-shadow: 1px 1px 8px rgba(0,0,0,0.1);
    -webkit-border-bottom-right-radius: 60px 5px;
    -moz-border-radius-bottomright: 60px 5px;
    border-bottom-right-radius: 60px 5px;
    -webkit-transform: skew(2deg,2deg)
                        translate(3px,8px);
    -moz-transform: skew(2deg,2deg)
                        translate(3px,8px);
        -o-transform: skew(2deg,2deg)
                        translate(3px,8px);
    transform: skew(2deg,2deg)
                        translate(3px,8px);
}
 
.box8:after{
    content: '';
    width: 98%;
    z-index:-1;
    height: 98%;
    padding: 0 0 1px 0;
    position: absolute;
    bottom:0; right:0;
    background: #fff;
    background: -webkit-gradient(linear, 0% 20%, 0% 100%, from(#f3f3f3), to(#f6f6f6), color-stop(.1,#fff));
    background: -moz-linear-gradient(0 0 360deg, #f3f3f3, #fff 10%, #f6f6f6);
    border: 1px solid #ccc;
    -webkit-box-shadow: 0px 0px 8px rgba(0,0,0, 0.1);
    -moz-box-shadow: 0px 0px 8px rgba(0,0,0, 0.1);
    box-shadow: 0px 0px 8px rgba(0,0,0, 0.1);
    -webkit-transform: skew(2deg,2deg)
                        translate(-1px,2px);
    -moz-transform: skew(2deg,2deg)
                        translate(-1px,2px) ;
        -o-transform: skew(2deg,2deg)
                        translate(-1px,2px) ;
    transform: skew(2deg,2deg)
                        translate(-1px,2px) ;
}

/*** BOX 9 ***/

.box9{
    width: 100%;
	min-height: 150px;
    padding: 0 0 1px 0;
    position:relative;
    background: #f3f3f3;
    background: -webkit-gradient(linear, 0% 20%, 0% 92%, from(#f3f3f3), to(#fff), color-stop(.1,#f3f3f3));
    background: -moz-linear-gradient(0 0 270deg, #f3f3f3, #f3f3f3 10%, #fff);
    border-top: 1px solid white;
    border-right: 1px solid #ccc;
    -webkit-border-bottom-right-radius: 60px 60px;
    -moz-border-radius-bottomright: 60px 60px;
    border-bottom-right-radius: 60px 60px;
    -webkit-box-shadow: -1px 2px 2px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: -1px 2px 2px rgba(0,0,0,0.2);
    box-shadow: -1px 2px 2px rgba(0,0,0,0.2);
 
}
 
.box9:before{
    content:'';
    width: 25px;
    height: 20px;
    background: white;
    position: absolute;
    bottom:0; right:0;
    background:#fff;
    background: -webkit-gradient(linear, 0% 20%, 50% 40%, from(#fff), to( #eee), color-stop(.1,#fff));
    background: -moz-linear-gradient(0 50%, #fff, #fff 10%, #eee);
    -webkit-border-bottom-right-radius: 30px;
    -moz-border-radius-bottomright: 30px;
    border-bottom-right-radius: 30px;
    -webkit-box-shadow: -2px -2px 5px rgba(0, 0, 0, 0.3);
    -moz-box-shadow: -2px -2px 5px rgba(0,0,0,0.3);
    box-shadow: -2px -2px 5px rgba(0, 0, 0, 0.3);
    -webkit-transform: rotate(-20deg)
                        skew(-40deg,-3deg)
                        translate(-13px,-13px);
                        transform: rotate(-20deg)
                        skew(-40deg,-3deg)
                        translate(-13px,-13px);
    -moz-transform: rotate(-20deg)
                        skew(-40deg,-3deg)
                        translate(-13px,-13px);
                        transform: rotate(-20deg)
                        skew(-40deg,-3deg)
                        translate(-13px,-13px);
    -o-transform: rotate(-20deg)
                        skew(-40deg,-3deg)
                        translate(-13px,-13px);
                        transform: rotate(-20deg)
                        skew(-40deg,-3deg)
                        translate(-13px,-13px);
    transform: rotate(-20deg)
                        skew(-40deg,-3deg)
                        translate(-13px,-13px);
                        transform: rotate(-20deg)
                        skew(-40deg,-3deg)
                        translate(-13px,-13px);
}
 
.box9:after{
    content: '';
    z-index: -1;
    width: 100px;
    height: 100px;
    position:absolute;
    bottom:0;
    right:0;
    background: rgba(0, 0, 0, 0.2);
    display: inline-block;
    -webkit-box-shadow: 20px 20px 8px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 20px 20px 17px rgba(0,0,0,0.2);
    box-shadow: 20px 20px 17px rgba(0,0,0,0.2);
    -webkit-transform: rotate(0deg)
                        translate(-45px,-20px)
                        skew(20deg);
    -moz-transform: rotate(0deg)
                        translate(-40px,-17px)
                        skew(20deg);
    -o-transform: rotate(0deg)
                        translate(-40px,-17px)
                        skew(20deg);
    transform: rotate(0deg)
                        translate(-40px,-17px)
                        skew(20deg);
}
 
.box9_tape{
    position:absolute;
    top:-25px; left: 30%;
    width: 130px;
    height: 40px;
    background:#ccc;
    background: -webkit-gradient(linear, 555% 20%, 0% 92%, from(rgba(0, 0, 0, 0.1)), to(rgba(0, 0, 0, 0.0)), color-stop(.1,rgba(0, 0, 0, 0.2)));
    background: -moz-linear-gradient(555% 0 180deg, rgba(0,0,0,0.1), rgba(0,0,0,0.2) 10%, rgba(0,0,0,0.0));
    border-left: 1px dashed rgba(0, 0, 0, 0.1);
    border-right: 1px dashed rgba(0, 0, 0, 0.1);
    -webkit-box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.2);
    box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.2);
}

/*** BOX 10 ***/

.box10{
    width: 100%;
	min-height: 150px;
    padding: 0 0 1px 0;
    position:relative;
    background:#f3f3f3;
    background: -webkit-gradient(linear, 0% 20%, 0% 92%, from(#f3f3f3), to(#fff), color-stop(.1,#f3f3f3));
    background: -moz-linear-gradient(0 0 270deg, #f3f3f3, #f3f3f3 10%, #fff);
    border-top: 1px solid #ccc;
    border-right: 1px solid #ccc;
    -webkit-border-bottom-right-radius: 60px 60px;
    -moz-border-radius-bottomright: 60px 60px;
    border-bottom-right-radius: 60px 60px;
    -webkit-border-bottom-left-radius: 60px 60px;
    -moz-border-radius-bottomleft: 60px 60px;
    border-bottom-left-radius: 60px 60px;
    -webkit-box-shadow: -1px 2px 2px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: -1px 2px 2px rgba(0, 0, 0, 0.2);
    box-shadow: -1px 2px 2px rgba(0, 0, 0, 0.2);
}
 
.box10:before{
    content:'';
    width: 25px;
    height: 20px;
    background: white;
    position: absolute;
    bottom:0; right:0;
    background: -webkit-gradient(linear, 0% 20%, 50% 40%, from(#fff), to( #eee), color-stop(.1,#fff));
    background: -moz-linear-gradient(0 50%, #fff, #fff 10%, #eee);
    -webkit-border-bottom-right-radius: 30px;
    -moz-border-radius-bottomright: 30px;
    border-bottom-right-radius: 30px;
    -webkit-box-shadow: -2px -2px 5px rgba(0, 0, 0, 0.3);
    -moz-box-shadow: -2px -2px 5px rgba(0, 0, 0, 0.3);
    box-shadow: -2px -2px 5px rgba(0, 0, 0, 0.3);
    -webkit-transform: rotate(-20deg)
                        skew(-40deg,-3deg)
                        translate(-13px,-13px);
    -moz-transform: rotate(-20deg)
                        skew(-40deg,-3deg)
                        translate(-13px,-13px);
    -o-transform: rotate(-20deg)
                        skew(-40deg,-3deg)
                        translate(-13px,-13px);
    transform: rotate(-20deg)
                        skew(-40deg,-3deg)
                        translate(-13px,-13px);
}
 
.box10:after{
    content: '';
    z-index: -10;
    width: 100px;
    height: 100px;
    position:absolute;
    bottom:0;
    right:0;
    background: rgba(0, 0, 0, 0.2);
    display: inline-block;
    -webkit-box-shadow: 20px 20px 8px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 20px 20px 17px rgba(0, 0, 0, 0.2);
    box-shadow: 20px 20px 8px rgba(0, 0, 0, 0.2);
    -webkit-transform: rotate(0deg)
                        translate(-45px,-20px)
                        skew(20deg);
    -moz-transform: rotate(0deg)
                        translate(-40px,-17px)
                        skew(20deg);
    -o-transform: rotate(0deg)
                        translate(-40px,-17px)
                        skew(20deg);
    transform: rotate(0deg)
                        translate(-45px,-20px)
                        skew(20deg);
}
 
.fold_box10{
    z-index: -10;
    width: 50px;
    height: 50px;
    position:absolute;
    bottom:0; left:0;
    -webkit-box-shadow: -20px 20px 8px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: -20px 20px 17px rgba(0, 0, 0, 0.2);
    box-shadow: -20px 20px 8px rgba(0, 0, 0, 0.2);
    -webkit-transform: rotate(0deg)
                        translate(40px,-20px)
                        skew(-20deg);
    -moz-transform: rotate(0deg)
                        translate(40px,-17px)
                        skew(-20deg);
    -o-transform: rotate(0deg)
                        translate(40px,-17px)
                        skew(-20deg);
    transform: rotate(0deg)
                        translate(40px,-20px)
                        skew(-20deg);
}
 
.fold2_box10{
    width: 25px;
    height: 20px;
    z-index:20;
    background: white;
    position: absolute;
    bottom:0; left:0;
    background: -webkit-gradient(linear, 0% 20%, 50% 80%, from(#fff), to( #eee), color-stop(.1,#fff));
    background: -moz-linear-gradient(0 50%, #fff, #fff 10%, #eee);
    -webkit-border-bottom-right-radius: 30px;
    -moz-border-radius-bottomright: 30px;
    border-bottom-right-radius: 30px;
    -webkit-box-shadow: -2px -2px 5px rgba(0, 0, 0, 0.3);
    -moz-box-shadow: -2px -2px 5px rgba(0, 0, 0, 0.3);
    box-shadow: -2px -2px 5px rgba(0, 0, 0, 0.3);
    -webkit-transform: rotate(103deg)
                        skew(-3deg,-40deg)
                        translate(-13px,-15px);
    -moz-transform: rotate(103deg)
                        skew(-3deg,-40deg)
                        translate(-13px,-15px);
    -o-transform: rotate(103deg)
                        skew(-3deg,-40deg)
                        translate(-13px,-15px);
    transform: rotate(103deg)
                        skew(-3deg,-40deg)
                        translate(-13px,-15px);
}
 
.box10_tape{
    content: '';
    position:absolute;
    top:-25px; left: 30%;
    width: 130px;
    height: 40px;
    background: #ccc;
    background: -webkit-gradient(linear, 555% 20%, 0% 92%, from(rgba(0, 0, 0, 0.1)), to(rgba(0, 0, 0, 0.0)), color-stop(.1,rgba(0, 0, 0, 0.2)));
    background: -moz-linear-gradient(555% 0% 180deg, rgba(0,0,0,0.1), rgba(0,0,0,0.2) 10%, rgba(0,0,0,0.0));
    border-left: 1px dashed rgba(0, 0, 0, 0.1);
    border-right: 1px dashed rgba(0, 0, 0, 0.1);
    -webkit-box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.2);
    box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.2);
}

/*** BOX 11 ***/

.box11{
    width: 100%;
	min-height: 150px;
    padding: 0 0 1px 0;
    position:relative;
    background:#fff;
    background: -webkit-gradient(linear, 0% 20%, 0% 92%, from(#fff), to(#f3f3f3), color-stop(.1,#fff));
    background: -moz-linear-gradient(0% 0% 270deg, #fff, #fff 10%, #f3f3f3);
    border-top: 1px solid #ccc;
    border-right: 1px solid #ccc;
    border-left: 1px solid #ccc;
    -webkit-border-top-left-radius: 60px 5px;
    -moz-border-radius-topleft:60px 5px;
    border-top-left-radius:60px 5px;
    -webkit-border-top-right-radius: 60px 5px;
    -moz-border-radius-topright:60px 5px;
    border-top-right-radius:60px 5px;
    -webkit-border-bottom-right-radius: 60px 60px;
    -moz-border-radius-bottomright:60px 60px;
    border-bottom-right-radius: 60px 60px;
    -webkit-box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.3) ;
    -moz-box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.3) ;
    box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.3) ;
}
 
.box11:before{
    content:'';
    width: 25px;
    height: 20px;
    position: absolute;
    bottom:0;
    right:0;
    -webkit-border-bottom-right-radius: 30px;
    -moz-border-radius-bottomright: 30px;
    border-bottom-right-radius: 30px;
    -webkit-box-shadow: -2px -2px 5px rgba(0, 0, 0, 0.3);
    -moz-box-shadow: -2px -2px 5px rgba(0, 0, 0, 0.3);
    box-shadow: -2px -2px 5px rgba(0, 0, 0, 0.3);
    -webkit-transform:
                        rotate(-20deg)
                        skew(-40deg,-3deg)
                        translate(-13px,-13px);
    -moz-transform: rotate(-20deg)
                    skew(-40deg,-3deg)
                    translate(-13px,-13px);
    -o-transform:   rotate(-20deg)
                    skew(-40deg,-3deg)
                    translate(-13px,-13px);
    transform:  rotate(-20deg)
                        skew(-40deg,-3deg)
                        translate(-13px,-13px);
}
 
.box11:after{
    content: '';
    z-index: -10;
    width: 100px;
    height: 100px;
    position:absolute;
    bottom:0;
    right:0;
    background: rgba(0, 0, 0, 0.2);
    display: inline-block;
    -webkit-box-shadow: 20px 20px 8px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 20px 20px 18px rgba(0, 0, 0, 0.2);
    box-shadow: 20px 20px 8px rgba(0, 0, 0, 0.2);
    -webkit-transform: rotate(0deg)
                        translate(-45px,-20px)
                        skew(20deg);
    -moz-transform: rotate(0deg)
                        translate(-45px,-20px)
                        skew(20deg);
    -o-transform: rotate(0deg)
                        translate(-45px,-20px)
                        skew(20deg);
    transform: rotate(0deg)
               translate(-45px,-20px)
               skew(20deg);
}
 
.box11_corner_lf{
    width: 100px;
    height: 100px;
    top:0; left:0;
    position:absolute;
    z-index:-6;
    display: inline-block;
    -webkit-box-shadow: -10px -10px 10px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: -10px -10px 10px rgba(0, 0, 0, 0.2);
    box-shadow: -10px -10px 10px rgba(0, 0, 0, 0.2);
    -webkit-transform: rotate(2deg)
                        translate(20px,25px)
                        skew(20deg);
    -moz-transform: rotate(2deg)
                        translate(20px,25px)
                        skew(20deg);
    -o-transform: rotate(2deg)
                        translate(20px,25px)
                        skew(20deg);
    transform: rotate(2deg)
                translate(20px,25px)
                skew(20deg);
}
 
.box11_corner_rt{
    content: '';
    width: 50px;
    height: 50px;
    top:0; right:0;
    position:absolute;
    display: inline-block;
    z-index:-6;
    -webkit-box-shadow: 10px -10px 8px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 10px -10px 8px rgba(0, 0, 0, 0.2);
    box-shadow: 10px -10px 8px rgba(0, 0, 0, 0.2);
    -webkit-transform: rotate(2deg)
                        translate(-14px,20px)
                        skew(-20deg);
    -moz-transform: rotate(2deg)
                        translate(-14px,20px)
                        skew(-20deg);
    -o-transform: rotate(2deg)
                        translate(-14px,20px)
                        skew(-20deg);
    transform: rotate(2deg)
               translate(-14px,20px)
               skew(-20deg);
}
 
.box11_tape:before{
    content: '';
    position:absolute;
    top:0; left: 0;
    width: 130px;
    height: 40px;
    background:rgba(0,0,0,0.2);
    background: -webkit-gradient(linear, 555% 20%, 0% 92%, from(rgba(0, 0, 0, 0.1)), to(rgba(0, 0, 0, 0.0)), color-stop(.1,rgba(0, 0, 0, 0.2)));
    background: -moz-linear-gradient(555% 0% 180deg, rgba(0,0,0,0.1), rgba(0,0,0,0.2) 10%, rgba(0,0,0,0.0));
    border-left: 1px dashed rgba(0, 0, 0, 0.1);
    border-right: 1px dashed rgba(0, 0, 0, 0.1);
    -webkit-box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.2);
    box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.2);
    -webkit-transform: rotate(90deg) skew(0,0) translate(100px,65px);
    -moz-transform: rotate(90deg) skew(0,0) translate(100px,65px);
    -o-transform: rotate(90deg) skew(0,0) translate(100px,65px);
    transform: rotate(90deg) skew(0,0) translate(100px,65px);
}
 
.box11_tape:after{
    content: '';
    position:absolute;
    top:0; right: 0;
    width: 130px;
    height: 40px;
    background:rgba(0, 0, 0, 0.1);
    background: -webkit-gradient(linear, 555% 20%, 0% 92%, from(rgba(0, 0, 0, 0.1)), to(rgba(0, 0, 0, 0.0)), color-stop(.1,rgba(0, 0, 0, 0.2)));
    background: -moz-linear-gradient(555% 0% 180deg, rgba(0,0,0,0.1), rgba(0,0,0,0.2) 10%, rgba(0,0,0,0.0));
    border-left: 1px dashed rgba(0, 0, 0, 0.1);
    border-right: 1px dashed rgba(0, 0, 0, 0.1);
    -webkit-box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.2);
    box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.2);
    -webkit-transform: rotate(90deg) skew(0,0) translate(100px,-65px);
    -moz-transform: rotate(90deg) skew(0,0) translate(100px,-65px);
    -o-transform: rotate(90deg) skew(0,0) translate(100px,-65px);
    transform: rotate(90deg) skew(0,0) translate(100px,-65px);
}

/*** BOX 12 ***/

.box12{
    width: 100%;
    padding: 5px 0 ;
    position:relative;
    background:#fff;
    background: -webkit-gradient(linear, 0% 20%, 0% 92%, from(#fff), to(#f3f3f3), color-stop(.1,#fff));
    background: -moz-linear-gradient(0% 0% 270deg, #fff, #fff 10%, #f3f3f3);
    border: 1px solid #ccc;
    -webkit-border-radius: 60px 5px;
    -moz-border-radius: 60px/5px;
    border-radius: 60px/5px;
    -webkit-box-shadow: 0px 0px 35px rgba(0, 0, 0, 0.1) inset;
    -moz-box-shadow: 0px 0px 35px rgba(0, 0, 0, 0.1) inset;
    box-shadow: 0px 0px 35px rgba(0, 0, 0, 0.1) inset;
}
 
.box12:before{
    content: '';
    width: 50px;
    height: 50px;
    top:0; right:0;
    position:absolute;
    display: inline-block;
    z-index:-1;
    -webkit-box-shadow: 10px -10px 8px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 10px -10px 8px rgba(0, 0, 0, 0.2);
    box-shadow: 10px -10px 8px rgba(0, 0, 0, 0.2);
    -webkit-transform: rotate(2deg)
                        translate(-14px,20px)
                        skew(-20deg);
    -moz-transform: rotate(2deg)
                        translate(-14px,20px)
                        skew(-20deg);
    -o-transform: rotate(2deg)
                        translate(-14px,20px)
                        skew(-20deg);
    transform: rotate(2deg)
                translate(-14px,20px)
                skew(-20deg);
}
 
.box12:after{
    content: '';
    width: 100px;
    height: 100px;
    top:0; left:0;
    position:absolute;
    z-index:-1;
    display: inline-block;
    -webkit-box-shadow: -10px -10px 10px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: -10px -10px 10px rgba(0, 0, 0, 0.2);
    box-shadow: -10px -10px 10px rgba(0, 0, 0, 0.2);
    -webkit-transform: rotate(2deg)
                        translate(20px,25px)
                        skew(20deg);
    -moz-transform:  rotate(2deg)
                        translate(20px,25px)
                        skew(20deg);
    -o-transform:  rotate(2deg)
                        translate(20px,25px)
                        skew(20deg);
    transform:  rotate(2deg)
                        translate(20px,25px)
                        skew(20deg);
}
 
.box12_tape{
    position:absolute;
    top:0; right: 0;
    width: 130px;
    height: 40px;
    background: rgba(0, 0, 0, 0.1);
    background: -webkit-gradient(linear, 555% 20%, 0% 92%, from(rgba(0, 0, 0, 0.1)), to(rgba(0, 0, 0, 0.0)), color-stop(.1,rgba(0, 0, 0, 0.2)));
    background: -moz-linear-gradient(555% 0% 180deg, rgba(0,0,0,0.1), rgba(0,0,0,0.2) 10%, rgba(0,0,0,0.0));
    border-left: 1px dashed rgba(0, 0, 0, 0.1);
    border-right: 1px dashed rgba(0, 0, 0, 0.1);
    -webkit-box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 0px 0px 12px rgba(0,0,0,0.2);
    box-shadow: 0px 0px 12px rgba(0,0,0,0.2);
    -webkit-transform: rotate(6deg) skew(0,0) translate(-60%,-5px);
    -moz-transform: rotate(6deg) skew(0,0) translate(-60%,-5px);
    -o-transform: rotate(6deg) skew(0,0) translate(-60%,-5px);
    transform: rotate(6deg) skew(0,0) translate(-60%,-5px);
}

/*** BOX 13 ***/

.box13{
    width: 100%;
	min-height: 150px;
    padding: 0 0 1px 0;
    position:relative;
    background:#fff;
    background: -webkit-gradient(linear, 100% 100%, 50% 10%, from(#fff), to(#f3f3f3), color-stop(.1,#fff));
    background: -moz-linear-gradient(100% 50% 90deg, #fff, #fff 10%, #f3f3f3);
    border: 1px solid #ccc;
    -webkit-box-shadow: 1px 1px 4px rgba(0,0,0, 0.1);
    -moz-box-shadow: 1px 1px 4px rgba(0,0,0,0.1);
    box-shadow: 1px 1px 4px rgba(0,0,0,0.1);
    -webkit-border-bottom-right-radius: 60px 5px;
    -moz-border-radius-bottomright: 60px 5px;
    border-bottom-right-radius:  60px 5px;
}
 
.box13:before{
    content: '';
    width: 98%;
    z-index:-1;
    height: 100%;
    padding: 0 0 1px 0;
    position: absolute;
    bottom:0; right:0;
    background: #fff;
    background: -webkit-gradient(linear, 0% 20%, 0% 92%, from(#fff), to(#f9f9f9), color-stop(.1,#fff));
    background: -moz-linear-gradient(0 0 270deg, #fff, #fff 10%, #f9f9f9);
    border: 1px solid #ccc;
    -webkit-box-shadow: 1px 1px 8px rgba(0,0,0, 0.1);
    -moz-box-shadow: 1px 1px 8px rgba(0,0,0,0.1);
    box-shadow: 1px 1px 8px rgba(0,0,0,0.1);
    -webkit-border-bottom-right-radius: 60px 5px;
    -moz-border-radius-bottomright: 60px 5px;
    border-bottom-right-radius:  60px 5px;
 
    -webkit-transform: skew(2deg,2deg)
                        translate(3px,8px);
    -moz-transform: skew(2deg,2deg)
                        translate(3px,8px);
    -o-transform: skew(2deg,2deg)
                        translate(3px,8px);
    transform: skew(2deg,2deg)
                        translate(3px,8px);
}
 
.box13:after{
    content: '';
    width: 98%;
    z-index:-1;
    height: 98%;
    padding: 0 0 1px 0;
    position: absolute;
    bottom:0; right:0;
    background: #f3f3f3;
    background: -webkit-gradient(linear, 0% 20%, 0% 100%, from(#f3f3f3), to(#f6f6f6), color-stop(.1,#fff));
    background: -moz-linear-gradient(0% 0% 360deg, #f3f3f3, #fff, #f6f6f6);
    border: 1px solid #ccc;
    -webkit-box-shadow: 0px 0px 8px rgba(0,0,0, 0.1);
    -moz-box-shadow: 0px 0px 8px rgba(0,0,0,0.1);
    box-shadow: 0px 0px 8px rgba(0,0,0,0.1);
    -webkit-transform: skew(2deg,2deg)
                        translate(-1px,2px);
    -moz-transform: skew(2deg,2deg)
                        translate(-1px,2px);
    -o-transform: skew(2deg,2deg)
                        translate(-1px,2px);
    transform: skew(2deg,2deg)
               translate(-1px,2px);
}
 
.box13_tape{
    position:absolute;
    top:0; left: 0;
    width: 130px;
    height: 40px;
    background:rgba(0, 0, 0, 0.1);
    background: -webkit-gradient(linear, 555% 20%, 0% 92%, from(rgba(0, 0, 0, 0.1)), to(rgba(0, 0, 0, 0.0)), color-stop(.1,rgba(0, 0, 0, 0.2)));
    background: -moz-linear-gradient(555% 0 180deg, rgba(0,0,0,0.1), rgba(0,0,0,0.2) 10%, rgba(0,0,0,0.0));
    border-left: 1px dashed rgba(0, 0, 0, 0.1);
    border-right: 1px dashed rgba(0, 0, 0, 0.1);
    -webkit-box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 0px 0px 12px rgba(0,0,0,0.2);
    box-shadow: 0px 0px 12px rgba(0,0,0,0.2);
    -webkit-transform: rotate(-30deg) skew(0,0) translate(-30px,-20px);
    -moz-transform: rotate(-30deg) skew(0,0) translate(-30px,-20px);
    -o-transform: rotate(-30deg) skew(0,0) translate(-30px,-20px);
    transform: rotate(-30deg) skew(0,0) translate(-30px,-20px);
}

.box {
	width:100%;
    color: #444444;
	background:#FFF;
	background: #fff;
-webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.27), 0 0 40px rgba(0, 0, 0, 0.06) inset;
-moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.27), 0 0 40px rgba(0, 0, 0, 0.06) inset;
box-shadow: 0 1px 4px rgba(0, 0, 0, 0.27), 0 0 40px rgba(0, 0, 0, 0.06) inset; }
}
/*==================================================
 * Effect 1
 * ===============================================*/
.effect1{
	-webkit-box-shadow: 0 10px 6px -6px #777;
	   -moz-box-shadow: 0 10px 6px -6px #777;
	        box-shadow: 0 10px 6px -6px #777;
}

/*==================================================
 * Effect 2
 * ===============================================*/
.effect2
{
  position: relative;
}
.effect2:before, .effect2:after
{
  z-index: -1;
  position: absolute;
  content: "";
  bottom: 15px;
  left: 10px;
  width: 50%;
  top: 80%;
  max-width:300px;
  background: #777;
  -webkit-box-shadow: 0 15px 10px #777;
  -moz-box-shadow: 0 15px 10px #777;
  box-shadow: 0 15px 10px #777;
  -webkit-transform: rotate(-3deg);
  -moz-transform: rotate(-3deg);
  -o-transform: rotate(-3deg);
  -ms-transform: rotate(-3deg);
  transform: rotate(-3deg);
}
.effect2:after
{
  -webkit-transform: rotate(3deg);
  -moz-transform: rotate(3deg);
  -o-transform: rotate(3deg);
  -ms-transform: rotate(3deg);
  transform: rotate(3deg);
  right: 10px;
  left: auto;
}

/*==================================================
 * Effect 3
 * ===============================================*/
.effect3
{
  position: relative;
}
.effect3:before
{
  z-index: -1;
  position: absolute;
  content: "";
  bottom: 15px;
  left: 10px;
  width: 50%;
  top: 80%;
  max-width:300px;
  background: #777;
  -webkit-box-shadow: 0 15px 10px #777;
  -moz-box-shadow: 0 15px 10px #777;
  box-shadow: 0 15px 10px #777;
  -webkit-transform: rotate(-3deg);
  -moz-transform: rotate(-3deg);
  -o-transform: rotate(-3deg);
  -ms-transform: rotate(-3deg);
  transform: rotate(-3deg);
}

/*==================================================
 * Effect 4
 * ===============================================*/
.effect4
{
  position: relative;
}
.effect4:after
{
  z-index: -1;
  position: absolute;
  content: "";
  bottom: 15px;
  right: 10px;
  left: auto;
  width: 50%;
  top: 80%;
  max-width:300px;
  background: #777;
  -webkit-box-shadow: 0 15px 10px #777;
  -moz-box-shadow: 0 15px 10px #777;
  box-shadow: 0 15px 10px #777;
  -webkit-transform: rotate(3deg);
  -moz-transform: rotate(3deg);
  -o-transform: rotate(3deg);
  -ms-transform: rotate(3deg);
  transform: rotate(3deg);
}

/*==================================================
 * Effect 5
 * ===============================================*/
.effect5
{
  	position:relative;
    -webkit-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
       -moz-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
            box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
}
.effect5:before, .effect5:after
{
	content:"";
    position:absolute;
    z-index:-1;
    -webkit-box-shadow:0 0 20px rgba(0,0,0,0.8);
    -moz-box-shadow:0 0 20px rgba(0,0,0,0.8);
    box-shadow:0 0 20px rgba(0,0,0,0.8);
    top:50%;
    bottom:0;
    left:10px;
    right:10px;
    -moz-border-radius:100px / 10px;
    border-radius:100px / 10px;
}
.effect5:after

{
	right:10px;
    left:auto;
    -webkit-transform:skew(8deg) rotate(3deg);
       -moz-transform:skew(8deg) rotate(3deg);
        -ms-transform:skew(8deg) rotate(3deg);
         -o-transform:skew(8deg) rotate(3deg);
            transform:skew(8deg) rotate(3deg);
}

/*==================================================
 * Effect 6
 * ===============================================*/
.effect6
{
  	position:relative;
    -webkit-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
       -moz-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
            box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
}
.effect6:before, .effect6:after
{
	content:"";
    position:absolute;
    z-index:-1;
    -webkit-box-shadow:0 0 20px rgba(0,0,0,0.8);
    -moz-box-shadow:0 0 20px rgba(0,0,0,0.8);
    box-shadow:0 0 20px rgba(0,0,0,0.8);
    top:0;
    bottom:0;
    left:10px;
    right:10px;
    -moz-border-radius:100px / 10px;
    border-radius:100px / 10px;
}
.effect6:after
{
	right:10px;
    left:auto;
    -webkit-transform:skew(8deg) rotate(3deg);
       -moz-transform:skew(8deg) rotate(3deg);
        -ms-transform:skew(8deg) rotate(3deg);
         -o-transform:skew(8deg) rotate(3deg);
            transform:skew(8deg) rotate(3deg);
}

/*==================================================
 * Effect 7
 * ===============================================*/
.effect7
{
  	position:relative;
    -webkit-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
       -moz-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
            box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
}
.effect7:before, .effect7:after
{
	content:"";
    position:absolute;
    z-index:-1;
    -webkit-box-shadow:0 0 20px rgba(0,0,0,0.8);
    -moz-box-shadow:0 0 20px rgba(0,0,0,0.8);
    box-shadow:0 0 20px rgba(0,0,0,0.8);
    top:10px;
    bottom:10px;
    left:0;
    right:0;
    -moz-border-radius:100px / 10px;
    border-radius:100px / 10px;
}
.effect7:after
{
	right:10px;
    left:auto;
    -webkit-transform:skew(8deg) rotate(3deg);
       -moz-transform:skew(8deg) rotate(3deg);
        -ms-transform:skew(8deg) rotate(3deg);
         -o-transform:skew(8deg) rotate(3deg);
            transform:skew(8deg) rotate(3deg);
}

/*
v(^^)v━━━━━━━━━━━━━━━━━━━v(^^)v

↓カラーボーダー

v(^^)v━━━━━━━━━━━━━━━━━━━v(^^)v 
*/


.box-color1 {
  height:100%;
  border: solid #45f365;
  position: relative;
  z-index:1;
}

.box-color2 {
  height:100%;
  border: solid #35e;
  position: relative;
  z-index:1;
}
.box-color3 {
  height:100%;
  border: solid #d32178;
  position: relative;
  z-index:1;
}

.box-color4 {
  height:100%;
  border: solid #31caef;
  position: relative;
  z-index:1;
}

.box-color5 {
  height:100%;
  border: solid #090;
  position: relative;
  z-index:1;
}

.box-color6 {
  height:100%;
  border: solid #c30;
  position: relative;
  z-index:1;
}
.box-color7 {
  height:100%;
  border: solid #f39;
  position: relative;
  z-index:1;
}
.box-color8 {
  height:100%;
  border: solid #f9f;
  position: relative;
  z-index:1;
}
.box-color9 {
  height:100%;
  border: solid #69f;
  position: relative;
  z-index:1;
}

/*
v(^^)v━━━━━━━━━━━━━━━━━━━v(^^)v

↓画像背景ボックス

v(^^)v━━━━━━━━━━━━━━━━━━━v(^^)v 
*/

.box-img01 {
	min-height: 50px;
	width: 100%;
	position: relative;
	z-index:1;
	border-radius: 8px;
	background-image:url(../../serch/images/back/box-img01.gif);
}
.box-img02 {
	min-height: 50px;
	width: 100%;
	position: relative;
	z-index:1;
	border-radius: 8px;
	background-image:url(../../serch/images/back/box-img02.gif); 
}
.box-img03 {
	min-height: 50px;
	width: 100%;
	position: relative;
	z-index:1;
	border-radius: 8px;
	background-image:url(../../serch/images/back/box-img03.gif); 
}
.box-img04 {
	min-height: 50px;
	width: 100%;
	position: relative;
	z-index:1;
	border-radius: 8px;
	background-image:url(../../serch/images/back/box-img04.gif); 
}
.box-img05 {
	min-height: 50px;
	width: 100%;
	position: relative;
	z-index:1;
	border-radius: 8px;
	background-image:url(../../serch/images/back/box-img05.gif); 
}
.box-img06 {
	min-height: 50px;
	width: 100%;
	position: relative;
	z-index:1;
	border-radius: 8px;
	background-image:url(../../serch/images/back/box-img06.gif); 
}
.box-img07 {
	min-height: 50px;
	width: 100%;
	position: relative;
	z-index:1;
	border-radius: 8px;
	background-image:url(../../serch/images/back/box-img07.gif); 
}
.box-img08 {
	min-height: 50px;
	width: 100%;
	position: relative;
	z-index:1;
	border-radius: 8px;
	background-image:url(../../serch/images/back/box-img08.gif); 
}
.box-img09 {
	min-height: 50px;
	width: 100%;
	position: relative;
	z-index:1;
	background-image:url(../../serch/images/back/box-img09.gif); 
}
.box-img10 {
	min-height: 50px;
	width: 100%;
	position: relative;
	z-index:1;
	background-image:url(../../serch/images/back/box-img10.gif); 
}
.box-img11 {
	min-height: 50px;
	width: 100%;
	position: relative;
	z-index:1;
	background-image:url(../../serch/images/back/box-img11.gif); 
}
.box-img12 {
	min-height: 50px;
	width: 100%;
	position: relative;
	z-index:1;
	background-image:url(../../serch/images/box-img12.gif); 
	}


.box-img13 {
	min-height: 50px;
	width: 100%;
	position: relative;
	z-index:1;
	background-image:url(../../serch/images/back/box-img13.gif); 
}
/*
v(^^)v━━━━━━━━━━━━━━━━━━━v(^^)v

↓罫線つきの背景

v(^^)v━━━━━━━━━━━━━━━━━━━v(^^)v 
*/
.note001 {
  background-color: #ffc;
  background-image: -webkit-linear-gradient(top, #e6e6e6 1px, transparent 1px), -webkit-linear-gradient(top, #ffffe6 0, #ffc 100%);
  background-image: -moz-linear-gradient(top, #e6e6e6 1px, transparent 1px), -moz-linear-gradient(top, #ffffe6 0, #ffc 100%);
  background-image: -o-linear-gradient(top, #e6e6e6 1px, transparent 1px), -o-linear-gradient(top, #ffffe6 0, #ffc 100%);
  background-image: -ms-linear-gradient(top, #e6e6e6 1px, transparent 1px), -ms-linear-gradient(top, #ffffe6 0, #ffc 100%);
  background-image: linear-gradient(to bottom, #e6e6e6 1px, transparent 1px), linear-gradient(to bottom, #ffffe6 0, #ffc 100%);
  background-position: 0 -1px, 0;
  -webkit-background-size: 2em 2em, 100%;
  -moz-background-size: 2em 2em, 100%;
  background-size: 2em 2em, 100%;
  -webkit-box-shadow: 0 1px 1px rgba(0,0,0,0.1);
  box-shadow: 0 1px 1px rgba(0,0,0,0.1);
  line-height: 2;
  margin: 0px;
  overflow: hidden;
  padding: 0 2em;
  position: relative;
  text-align: left;
  font-size: 1em;
  z-index:0;
}

.note002 {
  background-color: #ffffff;
  background-image: -webkit-linear-gradient(top, #e6e6e6 1px, transparent 1px), -webkit-linear-gradient(top, #ffffff 0, #f5f5f5 100%);
  background-image: -moz-linear-gradient(top, #e6e6e6 1px, transparent 1px), -moz-linear-gradient(top, #ffffff 0, #f5f5f5 100%);
  background-image: -o-linear-gradient(top, #e6e6e6 1px, transparent 1px), -o-linear-gradient(top, #ffffff 0, #f5f5f5 100%);
  background-image: -ms-linear-gradient(top, #e6e6e6 1px, transparent 1px), -ms-linear-gradient(top, #ffffff 0, #f5f5f5 100%);
  background-image: linear-gradient(to bottom, #e6e6e6 1px, transparent 1px), linear-gradient(to bottom, #ffffff 0, #f5f5f5 100%);
  background-position: 0 -1px, 0;
  -webkit-background-size: 2em 2em, 100%;
  -moz-background-size: 2em 2em, 100%;
  background-size: 2em 2em, 100%;
  -webkit-box-shadow: 0 1px 1px rgba(0,0,0,0.1);
  box-shadow: 0 1px 1px rgba(0,0,0,0.1);
  line-height: 2;
  margin: 0px;
  overflow: hidden;
  padding: 0 2em;
  position: relative;
  text-align: left;
  font-size: 1em;
  z-index:0;
}

.note003 {
  background-color: #ffc;
  background-image: -webkit-linear-gradient(top, #e6e6e6 1px, transparent 1px), -webkit-linear-gradient(top, #ffffff 0, #e5ffff 100%);
  background-image: -moz-linear-gradient(top, #e6e6e6 1px, transparent 1px), -moz-linear-gradient(top, #ffffff 0, #e5ffff 100%);
  background-image: -o-linear-gradient(top, #e6e6e6 1px, transparent 1px), -o-linear-gradient(top, #ffffff 0, #e5ffff 100%);
  background-image: -ms-linear-gradient(top, #e6e6e6 1px, transparent 1px), -ms-linear-gradient(top, #ffffff 0, #e5ffff 100%);
  background-image: linear-gradient(to bottom, #e6e6e6 1px, transparent 1px), linear-gradient(to bottom, #ffffff 0, #e5ffff 100%);
  background-position: 0 -1px, 0;
  -webkit-background-size: 2em 2em, 100%;
  -moz-background-size: 2em 2em, 100%;
  background-size: 2em 2em, 100%;
  -webkit-box-shadow: 0 1px 1px rgba(0,0,0,0.1);
  box-shadow: 0 1px 1px rgba(0,0,0,0.1);
  line-height: 2;
  margin: 0px;
  overflow: hidden;
  padding: 0 2em;
  position: relative;
  text-align: left;
  font-size: 1em;
  z-index:0;
}

.note004 {
  background-color: #ffffff;
  background-image: -webkit-linear-gradient(top, #000000 1px, transparent 1px), -webkit-linear-gradient(top, #333333 0, #1a1a1a 100%);
  background-image: -moz-linear-gradient(top, #000000 1px transparent 1px), -moz-linear-gradient(top, #333333 0, #1a1a1a 100%);
  background-image: -o-linear-gradient(top, #000000 1px, transparent 1px), -o-linear-gradient(top, #333333 0, #1a1a1a 100%);
  background-image: -ms-linear-gradient(top, #000000 1px, transparent 1px), -ms-linear-gradient(top, #333333 0, #1a1a1a 100%);
  background-image: linear-gradient(to bottom, #000000 1px, transparent 1px), linear-gradient(to bottom, #333333 0, #1a1a1a 100%);
  background-position: 0 -1px, 0;
  -webkit-background-size: 2em 2em, 100%;
  -moz-background-size: 2em 2em, 100%;
  background-size: 2em 2em, 100%;
  -webkit-box-shadow: 0 1px 1px rgba(0,0,0,0.1);
  box-shadow: 0 1px 1px rgba(0,0,0,0.1);
  line-height: 2;
  margin: 0px;
  overflow: hidden;
  padding: 0 2em;
  position: relative;
  text-align: left;
  font-size: 1em;
  z-index:0;
  color:#ffffff;
}

.note005 {
  background-image: -webkit-linear-gradient(top, #999999 1px, transparent 1px);
  background-image: -moz-linear-gradient(top, #999999 1px, transparent 1px);
  background-image: -o-linear-gradient(top, #999999 1px, transparent 1px);
  background-image: -ms-linear-gradient(top, #999999 1px, transparent 1px);
  background-image: linear-gradient(to bottom, #999999 1px, transparent 1px);
  background-position: 0 -1px, 0;
  -webkit-background-size: 2em 2em, 100%;
  -moz-background-size: 2em 2em, 100%;
  background-size: 2em 2em, 100%;
  line-height: 2;
  margin: 0px 50px;
  overflow: hidden;
  padding: 0 1em;
  position: relative;
  text-align: center;
  font-size: 1.200em;
  z-index:0;
}

/*
v(^^)v━━━━━━━━━━━━━━━━━━━v(^^)v

↓その他デザインボックス

v(^^)v━━━━━━━━━━━━━━━━━━━v(^^)v 
*/
/*** リボン付き1（コーナー） ***/

.ribbon {
　padding:5px;
  width: 97%;
  min-height: 60px;
  border-radius: 0px;
  position: relative;
  z-index: 90;
  line-height:180%;
background:#eee;background-image:-moz-linear-gradient(top, #fff, #eee);background-image:-ms-linear-gradient(top, #fff, #eee);background-image:-o-linear-gradient( top, #fff, #eee);background-image:-webkit-gradient(linear, left top, left bottom, from(#fff), to(#eee));background-image:-webkit-linear-gradient(top, #fff, #eee);background-image:linear-gradient(top, #fff, #eee);border:1px
solid #ddd;-moz-border-radius:5px;-webkit-border-radius:5px;border-radius:5px;-moz-box-shadow:0 1px 0 #9a9a9a;-webkit-box-shadow:0 1px 0 #9a9a9a;box-shadow:0 1px 0 #9a9a9a;padding:10px;
}
.inner  {border:1px dashed #ccc;padding:15px 20px 15px 20px;-moz-box-shadow:0 0 0 1px #fff;-webkit-box-shadow:0 0 0 1px #fff;box-shadow:0 0 0 1px #fff}

/*** 青リボン ***/ 
.ribbon-wrapper-blue {
  width: 85px;
  height: 88px;
  overflow: hidden;
  position: absolute;
  top: -3px;
  right: -3px;
}
 
.ribbon-blue {
  font: bold 15px Sans-Serif;
  color: #333;
  text-align: center;
  text-shadow: rgba(255,255,255,0.5) 0px 1px 0px;
  -webkit-transform: rotate(45deg);
  -moz-transform:    rotate(45deg);
  -ms-transform:     rotate(45deg);
  -o-transform:      rotate(45deg);
  position: relative;
  padding: 7px 0;
  left: -5px;
  top: 15px;
  width: 120px;
  background-color: #3BB9FF;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#306EFF), to(#3BB9FF));
  background-image: -webkit-linear-gradient(top, #306EFF, #3BB9FF);
  background-image:    -moz-linear-gradient(top, #306EFF, #3BB9FF);
  background-image:     -ms-linear-gradient(top, #306EFF, #3BB9FF);
  background-image:      -o-linear-gradient(top, #306EFF, #3BB9FF);
 
  color: #fff;
  -webkit-box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
  -moz-box-shadow:    0px 0px 3px rgba(0,0,0,0.3);
  box-shadow:         0px 0px 3px rgba(0,0,0,0.3);
}
 
.ribbon-blue:before, .ribbon-blue:after {
  content: "";
  border-top:   3px solid #6e8900;
  border-left:  3px solid transparent;
  border-right: 3px solid transparent;
  position:absolute;
  bottom: -3px;
}
 
.ribbon-blue:before {
  left: 0;
}
.ribbon-blue:after {
  right: 0;
}

/*** 赤リボン ***/ 
.ribbon-wrapper-red {
  width: 85px;
  height: 88px;
  overflow: hidden;
  position: absolute;
  top: -3px;
  right: -3px;
}

.ribbon-red {
  font: bold 15px Sans-Serif;
  color: #333;
  text-align: center;
  text-shadow: rgba(255,255,255,0.5) 0px 1px 0px;
  -webkit-transform: rotate(45deg);
  -moz-transform:    rotate(45deg);
  -ms-transform:     rotate(45deg);
  -o-transform:      rotate(45deg);
  position: relative;
  padding: 7px 0;
  left: -5px;
  top: 15px;
  width: 120px;
  background-color: #e50000;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#7f0000), to(#e50000));
  background-image: -webkit-linear-gradient(top, #7f0000, #e50000);
  background-image:    -moz-linear-gradient(top, #7f0000, #e50000);
  background-image:     -ms-linear-gradient(top, #7f0000, #e50000);
  background-image:      -o-linear-gradient(top, #7f0000, #e50000);
 
  color: #fff;
  -webkit-box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
  -moz-box-shadow:    0px 0px 3px rgba(0,0,0,0.3);
  box-shadow:         0px 0px 3px rgba(0,0,0,0.3);
}
 
.ribbon-red:before, .ribbon-red:after {
  content: "";
  border-top:   3px solid #6e8900;
  border-left:  3px solid transparent;
  border-right: 3px solid transparent;
  position:absolute;
  bottom: -3px;
}
 
.ribbon-red:before {
  left: 0;
}
.ribbon-red:after {
  right: 0;
}

/*** 金リボン ***/ 
.ribbon-wrapper-gold {
  width: 85px;
  height: 88px;
  overflow: hidden;
  position: absolute;
  top: -3px;
  right: -3px;
}

.ribbon-gold {
  font: bold 15px Sans-Serif;
  color: #333;
  text-align: center;
  text-shadow: rgba(255,255,255,0.5) 0px 1px 0px;
  -webkit-transform: rotate(45deg);
  -moz-transform:    rotate(45deg);
  -ms-transform:     rotate(45deg);
  -o-transform:      rotate(45deg);
  position: relative;
  padding: 7px 0;
  left: -5px;
  top: 15px;
  width: 120px;
  background-color: #f0e68c;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#b8860b), to(#f0e68c));
  background-image: -webkit-linear-gradient(top, #b8860b, #f0e68c);
  background-image:    -moz-linear-gradient(top, #b8860b, #f0e68c);
  background-image:     -ms-linear-gradient(top, #b8860b, #f0e68c);
  background-image:      -o-linear-gradient(top, #b8860b, #f0e68c);
 
  color: #fff;
  -webkit-box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
  -moz-box-shadow:    0px 0px 3px rgba(0,0,0,0.3);
  box-shadow:         0px 0px 3px rgba(0,0,0,0.3);
}
 
.ribbon-gold:before, .ribbon-gold:after {
  content: "";
  border-top:   3px solid #6e8900;
  border-left:  3px solid transparent;
  border-right: 3px solid transparent;
  position:absolute;
  bottom: -3px;
}
 
.ribbon-gold:before {
  left: 0;
}
.ribbon-gold:after {
  right: 0;
}


/*** リボン付き１（センター） ***/
.ribbon-center {
  width: 100%;
  min-height: 60px;
  border-radius: 0px;
  position: relative;
  z-index: 1;
  background:#eee;
  background-image:-moz-linear-gradient(top, #fff, #eee);
  background-image:-ms-linear-gradient(top, #fff, #eee);
  background-image:-o-linear-gradient( top, #fff, #eee);
  background-image:-webkit-gradient(linear, left top, left bottom, from(#fff), to(#eee));
  background-image:-webkit-linear-gradient(top, #fff, #eee);
  background-image:linear-gradient(top, #fff, #eee);
  border:1px solid #ddd;
  -moz-border-radius:5px;
  -webkit-border-radius:5px;
  border-radius:5px;
  -moz-box-shadow:0 1px 0 #9a9a9a;
  -webkit-box-shadow:0 1px 0 #9a9a9a;
  box-shadow:0 1px 0 #9a9a9a;
  padding:0px;
}
.ribbon-inner{
	color: #000000;
	outline: none;
	padding: 0px 10px;
	margin: 60px 0px 20px 0px;
	line-height:180%;
}
ribbon {
    background: #fff;
    float: left;
    min-height: 40px;
    margin: 0px;
    position: relative;
    text-align: center;
    width: 100%;
}
ribbon h2 {
    background-color: #3BB9FF;
    background-image: -webkit-gradient(linear, left top, left bottom, from(#306EFF), to(#3BB9FF));
    background-image: -webkit-linear-gradient(top, #306EFF, #3BB9FF);
    background-image:    -moz-linear-gradient(top, #306EFF, #3BB9FF);
    background-image:     -ms-linear-gradient(top, #306EFF, #3BB9FF);
    background-image:      -o-linear-gradient(top, #306EFF, #3BB9FF);
    border: 0 solid rgba(0,0,0,0.2);
    color: #fff;
    font-size: 34px;
    font-weight: bold;
    position: relative;
    text-shadow: -1px -1px 1px rgba(0,0,0,0.2);
}
ribbon.banner {
  z-index: -1;
}
ribbon.banner h2 {
    border-radius: 0 0 5px 5px;
    border-width: 0 1px 1px 1px;
    border-color: rgba(0,0,0,0.1);
    box-shadow: 0 0 4px rgba(0,0,0,0.3);
    display: inline-block;
    margin: -1px auto 0;
    padding: 15px 28px;
}
ribbon.banner h2:before, ribbon.banner h2:after {
    bottom: 4px;
    box-shadow: 0 6px 5px rgba(0,0,0,0.4);
    content: "";
    height: 10px;
    position: absolute;
    width: 47%;
    z-index: -1;
}
ribbon.banner h2::before {
    left: 3%;
    transform: rotate(-3.5deg);
}
ribbon.banner h2::after {
    right: 3%;
    transform: rotate(3.5deg);
}




/*** リボン付き2 ***/

.ribbon-text {
	clear: both;
	padding: 20px 30px 20px 30px;
	line-height:180%;
}

.ribbon-corner {
    position: absolute;
    left: 0;
    margin-top: 1px;
    border-top-color: #A2A2A2;
    border-left-color: #fff;
    border-style: solid;
    border-width: 4px 0 0 6px;
    line-height: 0;
}

/*** リボン付きオレンジ ***/
.ribbon-orange-box { 
    width: 100%;
    margin: 0px;
    padding-top: 10px;
    border: 1px solid #f69b1f;
    background:#fffbe5;
    background-image:-moz-linear-gradient(top, #ffffff, #fffbe5);
    background-image:-ms-linear-gradient(top, #ffffff, #fffbe5);
    background-image:-o-linear-gradient( top, #ffffff, #fffbe5);
    background-image:-webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#fffbe5));
    background-image:-webkit-linear-gradient(top, #ffffff, #fffbe5);
    background-image:linear-gradient(top, #ffffff, #fffbe5);
}
.ribbon-orange-outer {
    position: relative;
    left: -8px;
    border: 1px solid #f69b1f;
    text-align: left;
    clear: both;
    float: left;
  }
.ribbon-orange-inner {
    padding: 1px 15px;
    border: 1px solid #fff;
    background:#ffa500;
    background-image:-moz-linear-gradient(top, #ffd700, #ffa500);
    background-image:-ms-linear-gradient(top, #ffd700, #ffa500);
    background-image:-o-linear-gradient( top, #ffd700, #ffa500);
    background-image:-webkit-gradient(linear, left top, left bottom, from(#ffd700), to(#ffa500));
    background-image:-webkit-linear-gradient(top, #ffd700, #ffa500);
    background-image:linear-gradient(top, #ffd700, #ffa500);
    color: #fff;
    text-transform: uppercase;
    font-weight: bold;
}

/*** リボン付き赤 ***/
.ribbon-red-box { 
    width: 100%;
    margin: 0px;
    padding-top: 10px;
    border: 1px solid #eb0000;
    background:#ffece5;
    background-image:-moz-linear-gradient(top, #ffffff, #ffece5);
    background-image:-ms-linear-gradient(top, #ffffff, #ffece5);
    background-image:-o-linear-gradient( top, #ffffff, #ffece5);
    background-image:-webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#ffece5));
    background-image:-webkit-linear-gradient(top, #ffffff, #ffece5);
    background-image:linear-gradient(top, #ffffff, #ffece5);
}
.ribbon-red-outer {
    position: relative;
    left: -8px;
    border: 1px solid #eb0000;
    text-align: left;
    clear: both;
    float: left;
  }
.ribbon-red-inner {
    padding: 1px 15px;
    border: 1px solid #fff;
    background:#eb0000;
    background-image:-moz-linear-gradient(top, #ff9999, #eb0000);
    background-image:-ms-linear-gradient(top, #ff9999, #eb0000);
    background-image:-o-linear-gradient( top, #ff9999, #eb0000);
    background-image:-webkit-gradient(linear, left top, left bottom, from(#ff9999), to(#eb0000));
    background-image:-webkit-linear-gradient(top, #ff9999, #eb0000);
    background-image:linear-gradient(top, #ff9999, #eb0000);
    color: #fff;
    text-transform: uppercase;
    font-weight: bold;
}

/*** リボン付き青 ***/
.ribbon-blue-box { 
    width: 100%;
    margin: 0px;
    padding-top: 20px;
    border: 1px solid #0000cd;
    background:#f0f8ff;
    background-image:-moz-linear-gradient(top, #ffffff, #f0f8ff);
    background-image:-ms-linear-gradient(top, #ffffff, #f0f8ff);
    background-image:-o-linear-gradient( top, #ffffff, #f0f8ff);
    background-image:-webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#f0f8ff));
    background-image:-webkit-linear-gradient(top, #ffffff, #f0f8ff);
    background-image:linear-gradient(top, #ffffff, #f0f8ff);
}
.ribbon-blue-outer {
    position: relative;
    left: -8px;
    border: 1px solid #0000cd;
    text-align: left;
    clear: both;
    float: left;
  }
.ribbon-blue-inner {
    padding: 10px 20px;
    border: 1px solid #fff;
    background:#306EFF;
    background-image:-moz-linear-gradient(top, #3BB9FF, #306EFF);
    background-image:-ms-linear-gradient(top, #3BB9FF, #306EFF);
    background-image:-o-linear-gradient( top, #3BB9FF, #306EFF);
    background-image:-webkit-gradient(linear, left top, left bottom, from(#3BB9FF), to(#306EFF));
    background-image:-webkit-linear-gradient(top, #3BB9FF, #306EFF);
    background-image:linear-gradient(top, #3BB9FF, #306EFF);
    color: #fff;
    text-transform: uppercase;
    font-weight: bold;
}


/*** リボン付き緑 ***/
.ribbon-green-box { 
    width: 100%;
    margin: 0px;
    padding-top: 10px;
    border: 1px solid #008000;
    background:#e0f9e0;
    background-image:-moz-linear-gradient(top, #ffffff, #e0f9e0);
    background-image:-ms-linear-gradient(top, #ffffff, #e0f9e0);
    background-image:-o-linear-gradient( top, #ffffff, #e0f9e0);
    background-image:-webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#e0f9e0));
    background-image:-webkit-linear-gradient(top, #ffffff, #e0f9e0);
    background-image:linear-gradient(top, #ffffff, #e0f9e0);
}
.ribbon-green-outer {
    position: relative;
    left: -8px;
    border: 1px solid #008000;
    text-align: left;
    clear: both;
    float: left;
  }
.ribbon-green-inner {
    padding: 1px 15px;
    border: 1px solid #fff;
    background:#008000;
    background-image:-moz-linear-gradient(top, #9acd32, #008000);
    background-image:-ms-linear-gradient(top, #9acd32, #008000);
    background-image:-o-linear-gradient( top, #9acd32, #008000);
    background-image:-webkit-gradient(linear, left top, left bottom, from(#9acd32), to(#008000));
    background-image:-webkit-linear-gradient(top, #9acd32, #008000);
    background-image:linear-gradient(top, #9acd32, #008000);
    color: #fff;
    text-transform: uppercase;
    font-weight: bold;
}


/*** リボン付き紫 ***/
.ribbon-purple-box { 
    width: 100%;
    margin: 0px;
    padding-top: 10px;
    border: 1px solid #800080;
    background:#edd5ed;
    background-image:-moz-linear-gradient(top, #edd5ed, #e5bded);
    background-image:-ms-linear-gradient(top, #edd5ed, #e5bded);
    background-image:-o-linear-gradient( top, #edd5ed, #e5bded);
    background-image:-webkit-gradient(linear, left top, left bottom, from(#edd5ed), to(#e5bded));
    background-image:-webkit-linear-gradient(top, #edd5ed, #e5bded);
    background-image:linear-gradient(top, #edd5ed, #e5bded);
}
.ribbon-purple-outer {
    position: relative;
    left: -8px;
    border: 1px solid #800080;
    text-align: left;
    clear: both;
    float: left;
  }
.ribbon-purple-inner {
	padding-top: 5px;
	padding-right: 15px;
	padding-left: 15px;
	padding-bottom: 1px;
	border: 1px solid #fff;
	background: #800080;
	background-image: -moz-linear-gradient(top, #dda0dd, #800080);
	background-image: -ms-linear-gradient(top, #dda0dd, #800080);
	background-image: -o-linear-gradient( top, #dda0dd, #800080);
	background-image: -webkit-gradient(linear, left top, left bottom, from(#dda0dd), to(#800080));
	background-image: -webkit-linear-gradient(top, #dda0dd, #800080);
	background-image: linear-gradient(top, #dda0dd, #800080);
	color: #fff;
	text-transform: uppercase;
	font-weight: bold;
}


/*** リボン付きピンク ***/
.ribbon-pink-box { 
    width: 100%;
    margin: 0px;
    padding-top: 10px;
    border: 1px solid #ff1493;
    background:#ffe5e9;
    background-image:-moz-linear-gradient(top, #ffffff, #ffe5e9);
    background-image:-ms-linear-gradient(top, #ffffff, #ffe5e9);
    background-image:-o-linear-gradient( top, #ffffff, #ffe5e9);
    background-image:-webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#ffe5e9));
    background-image:-webkit-linear-gradient(top, #ffffff, #ffe5e9);
    background-image:linear-gradient(top, #ffffff, #ffe5e9);
}
.ribbon-pink-outer {
    position: relative;
    left: -8px;
    border: 1px solid #ff1493;
    text-align: left;
    clear: both;
    float: left;
  }
.ribbon-pink-inner {
    padding: 1px 15px;
    border: 1px solid #fff;
    background:#ff1493;
    background-image:-moz-linear-gradient(top, #ffc0cb, #ff1493);
    background-image:-ms-linear-gradient(top, #ffc0cb, #ff1493);
    background-image:-o-linear-gradient( top, #ffc0cb, #ff1493);
    background-image:-webkit-gradient(linear, left top, left bottom, from(#ffc0cb), to(#ff1493));
    background-image:-webkit-linear-gradient(top, #ffc0cb, #ff1493);
    background-image:linear-gradient(top, #ffc0cb, #ff1493);
    color: #fff;
    text-transform: uppercase;
    font-weight: bold;
}


/*** リボン付き金 ***/
.ribbon-gold-box { 
    width: 100%;
    margin: 0px;
    padding-top: 10px;
    border: 1px solid #b8860b;
    background:#ffffe5;
    background-image:-moz-linear-gradient(top, #ffffff, #ffffe5);
    background-image:-ms-linear-gradient(top, #ffffff, #ffffe5);
    background-image:-o-linear-gradient( top, #ffffff, #ffffe5);
    background-image:-webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#ffffe5));
    background-image:-webkit-linear-gradient(top, #ffffff, #ffffe5);
    background-image:linear-gradient(top, #ffffff, #ffffe5);
}
.ribbon-gold-outer {
    position: relative;
    left: -8px;
    border: 1px solid #b8860b;
    text-align: left;
    clear: both;
    float: left;
  }
.ribbon-gold-inner {
    padding: 1px 15px;
    border: 1px solid #fff;
    background:#b8860b;
    background-image:-moz-linear-gradient(top, #f0e68c, #b8860b);
    background-image:-ms-linear-gradient(top, #f0e68c, #b8860b);
    background-image:-o-linear-gradient( top, #f0e68c, #b8860b);
    background-image:-webkit-gradient(linear, left top, left bottom, from(#f0e68c), to(#b8860b));
    background-image:-webkit-linear-gradient(top, #f0e68c, #b8860b);
    background-image:linear-gradient(top, #f0e68c, #b8860b);
    color: #fff;
    text-transform: uppercase;
    font-weight: bold;
}


/*** リボン付き黒 ***/
.ribbon-black-box { 
    width: 100%;
    margin: 0px;
    padding-top: 10px;
    border: 1px solid #333333;
	background:#f5f5f5;
    background-image:-moz-linear-gradient(top, #ffffff, #f5f5f5);
    background-image:-ms-linear-gradient(top, #ffffff, #f5f5f5);
    background-image:-o-linear-gradient( top, #ffffff, #f5f5f5);
    background-image:-webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#f5f5f5));
    background-image:-webkit-linear-gradient(top, #ffffff, #f5f5f5);
    background-image:linear-gradient(top, #ffffff, #f5f5f5);
}
.ribbon-black-outer {
	position: relative;
    left: -8px;
    border: 1px solid #333333;
    text-align: left;
    clear: both;
    float: left;
  }
.ribbon-black-inner {
    padding: 1px 15px;
    border: 1px solid #fff;
    background:#333333;
    background-image:-moz-linear-gradient(top, #a9a9a9, #333333);
    background-image:-ms-linear-gradient(top, #a9a9a9, #333333);
    background-image:-o-linear-gradient( top, #a9a9a9, #333333);
    background-image:-webkit-gradient(linear, left top, left bottom, from(#a9a9a9), to(#333333));
    background-image:-webkit-linear-gradient(top, #a9a9a9, #333333);
    background-image:linear-gradient(top, #a9a9a9, #333333);
    color: #fff;
    text-transform: uppercase;
    font-weight: bold;
}


/*** リボン付き3 ***/

.promoBox {
	display: inline-block;
	position: relative;
	margin-bottom: 0px;
	padding: 20px;
	width: 94%;
    border: 2px solid #ddd;
	-webkit-border-radius: 8px;
			border-radius: 8px;
  	overflow: hidden;

	background: #ffffff;
	background: -moz-linear-gradient(-45deg, #ffffff 0%, #f1f1f1 50%, #e1e1e1 51%, #f6f6f6 100%);
	background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,#ffffff), color-stop(50%,#f1f1f1), color-stop(51%,#e1e1e1), color-stop(100%,#f6f6f6));
	background: -webkit-linear-gradient(-45deg, #ffffff 0%,#f1f1f1 50%,#e1e1e1 51%,#f6f6f6 100%);
	background: -o-linear-gradient(-45deg, #ffffff 0%,#f1f1f1 50%,#e1e1e1 51%,#f6f6f6 100%);
	background: -ms-linear-gradient(-45deg, #ffffff 0%,#f1f1f1 50%,#e1e1e1 51%,#f6f6f6 100%);
	background: linear-gradient(135deg, #ffffff 0%,#f1f1f1 50%,#e1e1e1 51%,#f6f6f6 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f6f6f6',GradientType=1 );

	-webkit-box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.2);
			box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.2);
}

.promoBox aside {
	position: absolute;
	width: 280px;
	right: 0;
	margin: 0 -65px 0 0;
	-webkit-transform: rotate(35deg);
	 -khtml-transform: rotate(35deg);
	   -moz-transform: rotate(35deg);
		-ms-transform: rotate(35deg);
			transform: rotate(35deg);
	-webkit-box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.2);
			box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.2);
	text-align: right;
	text-transform: uppercase;
	font-size: 15px;
	color: #fff;
	background: #4f85bb;
	background: -moz-linear-gradient(-45deg, #4f85bb 0%, #4f85bb 100%);
	background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,#4f85bb), color-stop(100%,#4f85bb));
	background: -webkit-linear-gradient(-45deg, #4f85bb 0%,#4f85bb 100%);
	background: -o-linear-gradient(-45deg, #4f85bb 0%,#4f85bb 100%);
	background: -ms-linear-gradient(-45deg, #4f85bb 0%,#4f85bb 100%);
	background: linear-gradient(135deg, #4f85bb 0%,#4f85bb 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4f85bb', endColorstr='#4f85bb',GradientType=1 );

}

.promoBox aside p { padding:10px 80px 10px 80px; margin: 0; }
.promoBox h4 { 
	font-size: 25px; 
	margin: 0; 
	padding: 0 25% 10px 10px; 
	border-bottom: 1px solid #ddd;
	line-height: 120%; 
}
.promoBox-inner { 
    padding: 10px 10px 10px 10px; 
	font-size: 15px;
	line-height: 180%; 
	 }

/* COLOR: Box & Text
\* --------------------------------- */
.promoBox.info-box {
	background: #e0f3fa;
	background: -moz-linear-gradient(-45deg, #e0f3fa 0%, #d8f0fc 50%, #b8e2f6 51%, #b6dffd 100%);
	background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,#e0f3fa), color-stop(50%,#d8f0fc), color-stop(51%,#b8e2f6), color-stop(100%,#b6dffd));
	background: -webkit-linear-gradient(-45deg, #e0f3fa 0%,#d8f0fc 50%,#b8e2f6 51%,#b6dffd 100%);
	background: -o-linear-gradient(-45deg, #e0f3fa 0%,#d8f0fc 50%,#b8e2f6 51%,#b6dffd 100%);
	background: -ms-linear-gradient(-45deg, #e0f3fa 0%,#d8f0fc 50%,#b8e2f6 51%,#b6dffd 100%);
	background: linear-gradient(135deg, #e0f3fa 0%,#d8f0fc 50%,#b8e2f6 51%,#b6dffd 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e0f3fa', endColorstr='#b6dffd',GradientType=1 );
	border-color: #b6e1f6;
}
.promoBox.info-box h4 { color: #225b9c; border-color: #8dc2dd; }

.promoBox.warning-box {
	background: #fceabb;
	background: -moz-linear-gradient(-45deg, #fceabb 0%, #fccd4d 50%, #f8b500 51%, #fbdf93 100%);
	background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,#fceabb), color-stop(50%,#fccd4d), color-stop(51%,#f8b500), color-stop(100%,#fbdf93));
	background: -webkit-linear-gradient(-45deg, #fceabb 0%,#fccd4d 50%,#f8b500 51%,#fbdf93 100%);
	background: -o-linear-gradient(-45deg, #fceabb 0%,#fccd4d 50%,#f8b500 51%,#fbdf93 100%);
	background: -ms-linear-gradient(-45deg, #fceabb 0%,#fccd4d 50%,#f8b500 51%,#fbdf93 100%);
	background: linear-gradient(135deg, #fceabb 0%,#fccd4d 50%,#f8b500 51%,#fbdf93 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fceabb', endColorstr='#fbdf93',GradientType=1 );
	border-color: #fccf5a;
}
.promoBox.warning-box h4 { color: #775600; border-color: #9e8135; }

.promoBox.danger-box {
	background: #f85032;
	background: -moz-linear-gradient(-45deg, #f85032 0%, #f16f5c 50%, #f6290c 51%, #f02f17 71%, #e73827 100%);
	background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,#f85032), color-stop(50%,#f16f5c), color-stop(51%,#f6290c), color-stop(71%,#f02f17), color-stop(100%,#e73827));
	background: -webkit-linear-gradient(-45deg, #f85032 0%,#f16f5c 50%,#f6290c 51%,#f02f17 71%,#e73827 100%);
	background: -o-linear-gradient(-45deg, #f85032 0%,#f16f5c 50%,#f6290c 51%,#f02f17 71%,#e73827 100%);
	background: -ms-linear-gradient(-45deg, #f85032 0%,#f16f5c 50%,#f6290c 51%,#f02f17 71%,#e73827 100%);
	background: linear-gradient(135deg, #f85032 0%,#f16f5c 50%,#f6290c 51%,#f02f17 71%,#e73827 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f85032', endColorstr='#e73827',GradientType=1 );
	border-color: #ff433e;
	color: #fff;
}
.promoBox.danger-box h4 { color: #fff; border-color: #ff706d; }

.promoBox.success-box {
	background: #9dd53a;
	background: -moz-linear-gradient(-45deg, #9dd53a 0%, #a1d54f 50%, #80c217 51%, #7cbc0a 100%);
	background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,#9dd53a), color-stop(50%,#a1d54f), color-stop(51%,#80c217), color-stop(100%,#7cbc0a));
	background: -webkit-linear-gradient(-45deg, #9dd53a 0%,#a1d54f 50%,#80c217 51%,#7cbc0a 100%);
	background: -o-linear-gradient(-45deg, #9dd53a 0%,#a1d54f 50%,#80c217 51%,#7cbc0a 100%);
	background: -ms-linear-gradient(-45deg, #9dd53a 0%,#a1d54f 50%,#80c217 51%,#7cbc0a 100%);
	background: linear-gradient(135deg, #9dd53a 0%,#a1d54f 50%,#80c217 51%,#7cbc0a 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#9dd53a', endColorstr='#7cbc0a',GradientType=1 );
	border-color: #9dd53a;
	color: #fff;
}
.promoBox.success-box h4 { color: #4d690b; border-color: #ccfc5a; }

/* COLOR: Ribbon
\* --------------------------------- */
.promoBox.info-ribbon aside {
	background: #1e5799;
	background: -moz-linear-gradient(top, #1e5799 0%, #2989d8 50%, #207cca 51%, #7db9e8 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#1e5799), color-stop(50%,#2989d8), color-stop(51%,#207cca), color-stop(100%,#7db9e8));
	background: -webkit-linear-gradient(top, #1e5799 0%,#2989d8 50%,#207cca 51%,#7db9e8 100%);
	background: -o-linear-gradient(top, #1e5799 0%,#2989d8 50%,#207cca 51%,#7db9e8 100%);
	background: -ms-linear-gradient(top, #1e5799 0%,#2989d8 50%,#207cca 51%,#7db9e8 100%);
	background: linear-gradient(to bottom, #1e5799 0%,#2989d8 50%,#207cca 51%,#7db9e8 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1e5799', endColorstr='#7db9e8',GradientType=0 );
}

.promoBox.warning-ribbon aside {
	background: #f9c667;
	background: -moz-linear-gradient(-45deg, #f9c667 0%, #f79621 100%);
	background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,#f9c667), color-stop(100%,#f79621));
	background: -webkit-linear-gradient(-45deg, #f9c667 0%,#f79621 100%);
	background: -o-linear-gradient(-45deg, #f9c667 0%,#f79621 100%);
	background: -ms-linear-gradient(-45deg, #f9c667 0%,#f79621 100%);
	background: linear-gradient(135deg, #f9c667 0%,#f79621 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f9c667', endColorstr='#f79621',GradientType=1 );
}

.promoBox.danger-ribbon aside {
	background: #ff3019;
	background: -moz-linear-gradient(45deg, #ff3019 0%, #cf0404 100%);
	background: -webkit-gradient(linear, left bottom, right top, color-stop(0%,#ff3019), color-stop(100%,#cf0404));
	background: -webkit-linear-gradient(45deg, #ff3019 0%,#cf0404 100%);
	background: -o-linear-gradient(45deg, #ff3019 0%,#cf0404 100%);
	background: -ms-linear-gradient(45deg, #ff3019 0%,#cf0404 100%);
	background: linear-gradient(45deg, #ff3019 0%,#cf0404 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff3019', endColorstr='#cf0404',GradientType=1 );
}

.promoBox.success-ribbon aside {
	background: #a9db80;
	background: -moz-linear-gradient(-45deg, #a9db80 0%, #96c56f 100%);
	background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,#a9db80), color-stop(100%,#96c56f));
	background: -webkit-linear-gradient(-45deg, #a9db80 0%,#96c56f 100%);
	background: -o-linear-gradient(-45deg, #a9db80 0%,#96c56f 100%);
	background: -ms-linear-gradient(-45deg, #a9db80 0%,#96c56f 100%);
	background: linear-gradient(135deg, #a9db80 0%,#96c56f 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a9db80', endColorstr='#96c56f',GradientType=1 );
}



/*** 吹き出し付き ***/

.article_box {
  width: 100%;
  margin: 0 auto;
  box-shadow: 0 0 50px 0 rgba(0, 0, 0, .1);
  margin-bottom: 25px;
}

.article_box_header_bg {
  display: block;
  background: #dcdcdc;
  color: rgba(0, 0, 0, .65);
  text-decoration: none;
  padding: 20px 30px 15px 30px;
  font-size: 18px;
  line-height: 1.5em;
  position: relative;
}

.article_box_header_bg span {
  border-bottom: 2px dashed transparent;
  transition: border .5s;
}
.article_box_header_bg:hover span {
  border-bottom-color: rgba(0, 0, 0, .25);
}

.article_box_text-fff {
  display: block;
  color: #FFF;
  line-height:180%;
}

.article_box_text-333 {
  display: block;
  color: #333333;
  line-height:180%;
}

/**シルバー**/

.silver .article_box_header_bg {
  background:#d3d3d3;
  background-image:-moz-linear-gradient(top, #fff, #d3d3d3);
  background-image:-ms-linear-gradient(top, #fff, #d3d3d3);
  background-image:-o-linear-gradient( top, #fff, #d3d3d3);
  background-image:-webkit-gradient(linear, left top, left bottom, from(#fff), to(#d3d3d3));
  background-image:-webkit-linear-gradient(top, #fff, #d3d3d3);
  background-image:linear-gradient(top, #fff, #d3d3d3);
  border:1px solid #ddd;
  -moz-border-radius:5px;
  -webkit-border-radius:5px;
  border-radius:5px;
  -moz-box-shadow:0 1px 0 #9a9a9a;
  -webkit-box-shadow:0 1px 0 #9a9a9a;
  box-shadow:0 1px 0 #9a9a9a;
}

.silver .article_box_meta::before {
  border-top-color: #d3d3d3;
}

.article_box_meta {
  background: #222;
  padding: 20px 25px;
  padding-top: 30px;
  position: relative;
  border:5px solid #d3d3d3;
  -moz-box-shadow:0 1px 0 #9a9a9a;
  -webkit-box-shadow:0 1px 0 #9a9a9a;
  box-shadow:0 1px 0 #9a9a9a;
}

.article_box_meta::before {
  content: ".";
  display: block;
  font-size: 0;
  border: 0 solid transparent;
  border-top-color: #dcdcdc;
  width: 0;
  height: 0;
  border-width: 15px 15px 0;
  position: absolute;
  top: 0;
}

.article_box_meta::after {
  content: ".";
  display: block;
  font-size: 0;
  border: 0 solid transparent;
  border-top-color: rgba(32, 32, 32, .25);
  width: 0;
  height: 0;
  border-width: 10px 10px 0;
  position: absolute;
  top: 0;
  margin-left: 5px;
}

/**レッド**/

.red .article_box_header_bg {
  color: #FFF;
  background:#660000;
  background-image:-moz-linear-gradient(top, #330000, #660000);
  background-image:-ms-linear-gradient(top, #330000, #660000);
  background-image:-o-linear-gradient( top, #330000, #660000);
  background-image:-webkit-gradient(linear, left top, left bottom, from(#330000), to(#660000));
  background-image:-webkit-linear-gradient(top, #330000, #660000);
  background-image:linear-gradient(top, #330000, #660000);
  border:1px solid #ddd;
  -moz-border-radius:5px;
  -webkit-border-radius:5px;
  border-radius:5px;
  -moz-box-shadow:0 1px 0 #9a9a9a;
  -webkit-box-shadow:0 1px 0 #9a9a9a;
  box-shadow:0 1px 0 #9a9a9a;
}

.article_box_meta2::before {
  border-top-color: #FFF;
}

.article_box_meta2 {
  background: #FFF;
  padding: 20px 25px;
  padding-top: 30px;
  position: relative;
  border:5px solid #660000;
  -moz-box-shadow:0 1px 0 #9a9a9a;
  -webkit-box-shadow:0 1px 0 #9a9a9a;
  box-shadow:0 1px 0 #9a9a9a;
}

.article_box_meta2::before {
  content: ".";
  display: block;
  font-size: 0;
  border: 0 solid transparent;
  border-top-color: #660000;
  width: 0;
  height: 0;
  border-width: 15px 15px 0;
  position: absolute;
  top: 0;
}

.article_box_meta2::after {
  content: ".";
  display: block;
  font-size: 0;
  border: 0 solid transparent;
  border-top-color: rgba(32, 32, 32, .25);
  width: 0;
  height: 0;
  border-width: 10px 10px 0;
  position: absolute;
  top: 0;
  margin-left: 5px;
}

/**ブラック**/

.black .article_box_header_bg {
  color: #FFF;
  background:#444;
  background-image:-moz-linear-gradient(top, #222, #444);
  background-image:-ms-linear-gradient(top, #222, #444);
  background-image:-o-linear-gradient( top, #222, #444);
  background-image:-webkit-gradient(linear, left top, left bottom, from(#222), to(#444));
  background-image:-webkit-linear-gradient(top, #222, #444);
  background-image:linear-gradient(top, #222, #444);
  border:1px solid #ddd;
  -moz-border-radius:5px;
  -webkit-border-radius:5px;
  border-radius:5px;
  -moz-box-shadow:0 1px 0 #9a9a9a;
  -webkit-box-shadow:0 1px 0 #9a9a9a;
  box-shadow:0 1px 0 #9a9a9a;
}

.black .article_box_meta::before {
  border-top-color: #d3d3d3;
}

.article_box_meta3 {
  background: #FFF;
  padding: 20px 25px;
  padding-top: 30px;
  position: relative;
  border:5px solid #444;
  -moz-box-shadow:0 1px 0 #9a9a9a;
  -webkit-box-shadow:0 1px 0 #9a9a9a;
  box-shadow:0 1px 0 #9a9a9a;
}

.article_box_meta3::before {
  content: ".";
  display: block;
  font-size: 0;
  border: 0 solid transparent;
  border-top-color: #444;
  width: 0;
  height: 0;
  border-width: 15px 15px 0;
  position: absolute;
  top: 0;
}

.article_box_meta3::after {
  content: ".";
  display: block;
  font-size: 0;
  border: 0 solid transparent;
  border-top-color: rgba(32, 32, 32, .25);
  width: 0;
  height: 0;
  border-width: 10px 10px 0;
  position: absolute;
  top: 0;
  margin-left: 5px;
}

/**ブルー**/

.blue .article_box_header_bg {
  color: #FFF;
  background:#3BB9FF;
  background-image:-moz-linear-gradient(top, #306EFF, #3BB9FF);
  background-image:-ms-linear-gradient(top, #306EFF, #3BB9FF);
  background-image:-o-linear-gradient( top, #306EFF, #3BB9FF);
  background-image:-webkit-gradient(linear, left top, left bottom, from(#306EFF), to(#3BB9FF));
  background-image:-webkit-linear-gradient(top, #306EFF, #3BB9FF);
  background-image:linear-gradient(top, #306EFF, #3BB9FF);
  border:1px solid #ddd;
  -moz-border-radius:5px;
  -webkit-border-radius:5px;
  border-radius:5px;
  -moz-box-shadow:0 1px 0 #9a9a9a;
  -webkit-box-shadow:0 1px 0 #9a9a9a;
  box-shadow:0 1px 0 #9a9a9a;
}

.blue .article_box_meta::before {
  border-top-color: #d3d3d3;
}

.article_box_meta4 {
  background: #FFF;
  padding: 20px 25px;
  padding-top: 30px;
  position: relative;
  border:5px solid #3BB9FF;
  -moz-box-shadow:0 1px 0 #9a9a9a;
  -webkit-box-shadow:0 1px 0 #9a9a9a;
  box-shadow:0 1px 0 #9a9a9a;
}

.article_box_meta4::before {
  content: ".";
  display: block;
  font-size: 0;
  border: 0 solid transparent;
  border-top-color: #3BB9FF;
  width: 0;
  height: 0;
  border-width: 15px 15px 0;
  position: absolute;
  top: 0;
}

.article_box_meta4::after {
  content: ".";
  display: block;
  font-size: 0;
  border: 0 solid transparent;
  border-top-color: rgba(32, 32, 32, .25);
  width: 0;
  height: 0;
  border-width: 10px 10px 0;
  position: absolute;
  top: 0;
  margin-left: 5px;
}

/**イエロー**/

.yellow .article_box_header_bg {
  color: #FFF;
  background:#b8860b;
  background-image:-moz-linear-gradient(top, #b8860b, #daa520);
  background-image:-ms-linear-gradient(top, #b8860b, #daa520);
  background-image:-o-linear-gradient( top, #b8860b, #daa520);
  background-image:-webkit-gradient(linear, left top, left bottom, from(#b8860b), to(#daa520));
  background-image:-webkit-linear-gradient(top, #b8860b, #daa520);
  background-image:linear-gradient(top, #b8860b, #daa520);
  border:1px solid #ddd;
  -moz-border-radius:5px;
  -webkit-border-radius:5px;
  border-radius:5px;
  -moz-box-shadow:0 1px 0 #9a9a9a;
  -webkit-box-shadow:0 1px 0 #9a9a9a;
  box-shadow:0 1px 0 #9a9a9a;
}

.yellow .article_box_meta::before {
  border-top-color: #d3d3d3;
}

.article_box_meta5 {
  background: #FFF;
  padding: 20px 25px;
  padding-top: 30px;
  position: relative;
  border:5px solid #daa520;
  -moz-box-shadow:0 1px 0 #9a9a9a;
  -webkit-box-shadow:0 1px 0 #9a9a9a;
  box-shadow:0 1px 0 #9a9a9a;
}

.article_box_meta5::before {
  content: ".";
  display: block;
  font-size: 0;
  border: 0 solid transparent;
  border-top-color: #daa520;
  width: 0;
  height: 0;
  border-width: 15px 15px 0;
  position: absolute;
  top: 0;
}

.article_box_meta5::after {
  content: ".";
  display: block;
  font-size: 0;
  border: 0 solid transparent;
  border-top-color: rgba(32, 32, 32, .25);
  width: 0;
  height: 0;
  border-width: 10px 10px 0;
  position: absolute;
  top: 0;
  margin-left: 5px;
}
/*
v(^^)v━━━━━━━━━━━━━━━━━━━v(^^)v

↓ポラロイド

v(^^)v━━━━━━━━━━━━━━━━━━━v(^^)v 
*/

/*** ポラロイド1 ***/

.pola1{
	width: 180px;
	min-height: 120px;
	position: relative;
	border: 2px solid #ccc;
	background: rgba(0, 0, 0, 0.5);
	-webkit-box-shadow: 0px 1px 12px rgba(0, 0, 0, 0.1);
	-moz-box-shadow: 0px 1px 12px rgba(0, 0, 0, 0.1);
	box-shadow: 0px 1px 12px rgba(0, 0, 0, 0.1);
}
 
.pola1:before{
    content: '';
    width: 110%;
    left: 0;
    height: 125%;
    z-index:-1;
    position:absolute;
    border: 1px solid #ccc;
    background: #f3f3f3;
    background: -webkit-gradient(linear, 0% 20%, 0% 92%, from(#f3f3f3), to(#fff), color-stop(.1,#f3f3f3));
    background: -moz-linear-gradient(0 0 90deg, #f3f3f3, #f3f3f3 10%, #fff);
    -webkit-box-shadow: 0px 0px 12px rgba(0, 0, 0, 0.1);
    -moz-box-shadow: 0px 0px 12px rgba(0,0,0,0.1);
    box-shadow: 0px 0px 12px rgba(0,0,0,0.1);
    -webkit-transform: translate(-5%,-5%);
    -moz-transform: translate(-5%, -5%);
    -o-transform: translate(-5%, -5%);
    transform: translate(-5%, -5%);
}
 
.pola1:after{
    content: '';
    width: 100%;
    left: 0;
    height: 115%;
    z-index:-2;
    background: none;
    position:absolute;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    border-radius: 20px;
    -webkit-box-shadow: 15px 0px 30px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 15px 0px 30px rgba(0, 0, 0, 0.2);
    box-shadow: 15px 0px 30px rgba(0, 0, 0, 0.2);
    -webkit-transform: translate(0,0);
    -moz-transform: translate(0,0);
    -o-transform: translate(0,0);
    transform: translate(0,0);
}