@charset "UTF-8";
body {
    font-family: sans-serif
}

header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 15000
}

p {
    margin: 0
}

.recommend_text a {
    color: #000
}

.sentence_text2 a {
    color: #fff
}

.recommend_text a:hover {
    color: #9a9a9a
}

.sentence_text2 a:hover {
    color: #584f36
}

ol, ul {
    list-style: none
}

ol, ul, dl, dt, dd {
    padding: 0;
    margin: 0
}

.spVisual {
    width: 100%;
    background-size: cover
}

.spVisual .titleBox {
    width: 1100px;
    margin: auto
}

img.main_title_pic {
    max-width: 100%
}

.cf:after {
    content: " ";
    display: block;
    clear: both
}

img {
    vertical-align: bottom
}
/*イルミナ*/
/* 吹き出し本体 */
.balloon1{
    position: relative;
    padding: 20px;
    background: linear-gradient(to bottom, #b3dced 0%,#29b8e5 100%);
    color: #ffffff;
}
/* グラデーションの開始の色に合わせた三角アイコン */
.balloon1::before{
    content: '';
    position: absolute;
    display: block;
    width: 0;
    height: 0;
    left: 20px;
    top: -15px;
    border-right: 15px solid transparent;
    border-bottom: 15px solid #b3dced;
    border-left: 15px solid transparent;
}

/* 吹き出し本体 */
.balloon2{
    position: relative;
    padding: 22px 0px;
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#554e7f+0,a19db8+100 */
    background: rgb(85,78,127); /* Old browsers */
    background: -moz-linear-gradient(top, rgba(85,78,127,1) 0%, rgba(161,157,184,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, rgba(85,78,127,1) 0%,rgba(161,157,184,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, rgba(85,78,127,1) 0%,rgba(161,157,184,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#554e7f', endColorstr='#a19db8',GradientType=0 ); /* IE6-9 */
    color: #ffffff;
    text-align: center;
    width: 700px;
    margin: auto;
    clear: both;
    letter-spacing: 1px;
    margin-bottom: 59px;
}
.balloon_wrap{
    padding-top: 110px;
    margin-bottom: 67px;
    clear: both;
}
/* グラデーションの終了の色に合わせた三角アイコン */
.balloon2::before{
    content: '';
    position: absolute;
    display: block;
    width: 0;
    height: 0;
    left: 46%;
    bottom: -15px;
    border-top: 16px solid #a19db8;
    border-right: 9px solid transparent;
    border-left: 9px solid transparent;
}
.balloon2_text1{font-size: 28px;font-weight:  bold;padding-bottom: 5px;}
.balloon2_text2{font-size: 17px;line-height: 20px;}
.back_color_4{
    width: 1100px;
    margin: auto;
}
.shareData {
    float: left!important;
    width: 275px!important;
    margin-top: -45px;
    padding-bottom: 85px;
    margin-left: 70px;
}
.movie{
    overflow: hidden;
    margin-top: -83px;
    margin-left: 330px;
    position: absolute;
    z-index: 9999;
    border: 13px solid #fff;
}
.movie_right{
    overflow: hidden;
    margin-top: -83px;
    margin-left: -239px;
    position: absolute;
    z-index: 9999;
    border: 13px solid #fff;
}
.movie img{
    width: 301px;
}
.movie_right img{
    width: 301px;
}
.slideShow_left{
    float: left;
    width: 41%;
}
.slideShow_right{
    float: left;
    width: 59%;
    padding-left: 44px;
}
.slideShow_right2{
    float: left;
    width: 59%;
    padding-right: 44px;
}
.illumina_text1{text-align:  center;font-size: 24px;line-height: 37px;font-weight:  bold;padding-bottom: 12px;padding-top: 38px;}
.illumina_text2{text-align:  center;font-size: 15px;line-height: 26px;padding-bottom: 10px;}
.illumina_text3{
    font-size: 15px;
    line-height: 32px;
    padding-top: 11px;
    height: 309px;
}
.illumina_text4{
    font-size: 15px;
    line-height: 32px;
    padding-top: 11px;
}
.illumina_text2_span {
    font-size: 10px;
    font-weight: bold;
    margin-right: 5px;
    letter-spacing: 1px;
}
.illumina_staff_wrap{
    padding-top: 6%;
    padding-left: 210px;
}
.illumina_staff_wrap3{
    padding-top: 10%;
    padding-left: 210px;
}
.illumina_staff_wrap_right{
    padding-top: 69px;
    width: 336px;
}
.illumina_staff_wrap2{
    padding: 0 3%;
    clear: both;
}
.illumina_staff_wrap4{
    padding-top: 63px;
    padding-left: 210px;
}
.illumina_staff_img{
    width:  100px;
    float:  left;
    padding-bottom: 20px;
}
.illumina_staff_img2{
    width:  100px;
    float:  left;
    padding-bottom: 14px;
}
.illumina_staff_text{
    float: left;
    font-size: 14px;
    line-height: 25px;
    padding-left: 20px;
    padding-top: 11px;
    /* font-weight: bold; */
}
.illumina_staff_span{
    font-size: 20px;
}
.shop_button{
    clear: both;
    text-align: center;
    background-color: #ff9999;
    color: #fff;
    font-size: 18px;
    padding: 19px 0;
    margin-bottom: 20px;
    letter-spacing: 2px;
    font-weight: bold;
}
.slideShow_space{
    padding-top: 20px;
    clear: both;
}
.slideShow_space2{
    padding-top: 45px;
    clear: both;
}
.illumina_staff_wrap_right2{
    width: 336px;
    padding-top: 6%;
}
.illumina_staff_right3{
    width: 330px;
}
.illumina_staff_right3_wrap{
    padding-top: 25px;
    width: 330px;
}
.illumina_staff_right4_wrap{
    overflow: hidden;
    width: 100%;
    padding-top: 20px;
}
.illumina_staff_right4{
    width: 330px;
    float: left;
    margin-right: 45px;
}
.illumina_staff_right4 .shop_button{
    font-size: 16px;
    padding: 12px 0px;
    margin-top: 10px;
}
.illumina_staff_right4 .illumina_staff_text {
    float: left;
    width: 60%;
    font-size: 14px;
    line-height: 25px;
    padding-left: 20px;
    padding-top: 0px;
}
.illumina_staff_right4 .scapsBox{
    display: block;
    background-color: #544d7e;
    color: #FFF;
    text-align: center;
    margin-bottom: 10px;
    height: 20px;
    width: 100px;
    font-size: 12px;
    border-radius: 15px;
}


.article{
    width: 1100px;
    margin:  auto;
    clear:  both;
    padding-top: 80px;
}
.article2{
    width: 1100px;
    margin:  auto;
    clear:  both;
    padding-top: 90px;
}
.article_title{
    text-align:  center;
    font-size: 26px;
    line-height: 41px;
    font-weight:  bold;
}
.article_title2{
    text-align:  center;
    font-size: 26px;
    line-height: 41px;
    font-weight:  bold;
    padding-top: 94px;
}
.article_line{
    border-bottom: 3px #544d7e solid;
    width:  50px;
    margin:  auto;
}
.article_img{padding-top: 60px;float:  left;width: 50%;}
.article_text{
    font-size: 15px;
    line-height: 32px;
    float:  left;
    width: 50%;
    padding-top: 60px;
    text-align:  left;
    padding-left: 40px;
    box-sizing: border-box;
}
.article_text_color{    color: #6052af;}
.article_space{
    padding-top: 24px;
}
.article_line {
    padding-bottom: 20px;
}
.article_img2{
    width: 100%;
    padding-top: 24px;
}
.article_text2{
    padding-top: 20px;
    text-align:  left;
    line-height: 32px;
    font-size: 15px;
}
/*イルミナ_end*/
.slideShow {
    margin: 40px auto;
    text-align: left;
    display: none
}

.slideShow .mainView {
}

.slideShow .mainView ul {
    width: 100%;
    overflow: hidden;
    position: relative
}

.slideShow .mainView ul li {
    top: 0;
    left: 0;
    width: 100%;
    position: absolute
}

.slideShow .mainView ul li img {
    width: 100%
}

.slideShow .thumbNail {
    padding-top: 16px;
}
.slideShow .thumbNail_right {
    float: right;
    margin-right: -26px;
}
.slideShow .thumbNail ul li {
    float: left;
    display: inline;
    overflow: hidden;
    cursor: pointer;
    width: 106px !important;
    margin-right: 10px
}

.slideShow .thumbNail ul li img {
    width: 100%;
    vertical-align: bottom
}

.slideShow .thumbNail ul li.active {
    filter: alpha(opacity=100) !important;
    -moz-opacity: 1 !important;
    opacity: 1 !important
}

.slideShow .mainView .btnPrev, .slideShow .mainView .btnNext {
    top: 0;
    width: 5%;
    height: 100%;
    position: absolute;
    z-index: 100
}

.slideShow .mainView .btnPrev {
    left: 0;
    background: #ccc url(../img/btnPrev.png) no-repeat center center
}

.slideShow .mainView .btnNext {
    right: 0;
    background: #ccc url(../img/btnNext.png) no-repeat center center
}

.slideShow ul:after {
    content: ".";
    height: 0;
    clear: both;
    display: block;
    visibility: hidden
}

.slideShow ul {
    display: block;
    overflow: hidden
}


.section07 {
    font-size: 26px;
    letter-spacing: 2px;
    background-color: #f1ece0;
    padding: 24px 0;
    width: 533px;
    margin: auto
}

.section07_span {
    color: #bba263;
    font-size: 34px
}

.section07 {
    position: relative
}

.section07:after {
    content: "";
    position: absolute;
    right: 0;
    bottom: -20px;
    left: 0;
    width: 0;
    height: 0;
    margin: auto;
    border-style: solid;
    border-color: #f1ece0 transparent transparent transparent;
    border-width: 20px 15px 0 15px
}

a {
    cursor: hand;
    cursor: pointer
}

#columnIndex {
    width: 1100px;
    margin: 0 auto;
    padding: 0 0 50px;
    position: relative
}

#columnIndex h3 {
    width: 40%;
    margin: 0 auto 20px;
    text-align: center;
    font-size: 24px;
    font-weight: bold;
    padding: 10px 0 40px;
    background-image: url(/images/sp/special/illumina_y/column_title.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center bottom
}

#columnIndex h3 span {
    color: #a47bf1
}

#column_list {
    width: 700px;
    margin: 0 auto
}

#columnIndex .morebtn {
    position: absolute;
    top: 5px;
    right: 0;
    margin: 0;
    padding: 10px 30px;
    background-color: #a47bf1;
    color: #fff;
    font-size: 18px
}

.column_box {
    float: left;
    width: 326px;
    height: 277px;
    text-align: left;
    margin: 0 7px 40px 0
}

.column_title {
    font-size: 40px;
    font-weight: 100;
    color: #666;
    text-align: center;
    padding: 35px 0 30px 0;
    margin: 0 auto
}

.column_title:first-letter {
    color: #a47bf1
}

.columnTitle {
    font-size: 26px;
    font-weight: bold;
    text-align: left
}

.columnTitle .topPhoto {
    background-color: #efefef;
    width: 100%;
    min-height: 380px;
    overflow: hidden;
    line-height: 100%
}

.columnTitle .topPhoto img {
    width: 100%;
    height: auto
}

.columnTitle h1 {
    padding: 15px 0 0;
    font-size: 26px;
    line-height: 180%;
    margin: 0
}

.column_box a {
    color: #666
}

.column_box img:hover {
    opacity: .8
}

.column_title {
    margin: 5px 0
}

p.column_text {
    font-size: 12px
}

p.salon {
    font-size: 12px;
    margin: 10px 0;
    float: left
}

p.salon .fa-pencil {
    color: #a47bf1
}

p.column_day {
    font-size: 10px;
    text-align: right;
    margin: 10px 0
}

p.column_dayleft {
    font-size: 10px;
    text-align: left;
    margin: 10px 0
}

.columnList {
    width: 1050px;
    overflow: hidden;
    margin: 65px auto 80px
}

.columnList a:hover {
    opacity: .7
}

.columnList .slide {
    width: 31.333%;
    height: 350px;
    margin: 0 3% 40px 0;
    float: left;
    text-align: left
}

.columnList .slide:nth-child(3), .columnList .slide:nth-child(6), .columnList .slide:nth-child(9), .columnList .slide:nth-child(12) {
    margin-right: 0
}

.columnList .slide .photoData {
    width: 100%;
    height: 250px;
    overflow: hidden;
    background-position: 50% 50%;
    background-size: cover;
    display: block
}

.columnList .slide .photoData div {
    display: table-cell;
    width: 329px;
    height: 250px;
    text-align: center;
    vertical-align: middle
}

.columnList .slide .photoData img {
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: 100%
}

.columnList .col_title {
    display: block;
    font-size: 16px;
    color: #666;
    font-weight: bold;
    padding: 10px 0 5px
}

.columnList .col_title:hover {
    text-decoration: underline;
    opacity: 1.0
}

.columnList .col_text {
    font-size: 12px;
    line-height: 160%;
    color: #666
}

.columnList .col_text .underBox {
    width: 100%;
    overflow: hidden;
    display: block;
    padding: 10px 0 0
}

.columnList .col_text span.writerBox {
    font-size: 11px;
    display: block;
    float: left;
    padding: 0 0 0 20px;
    background: url(/images/column/column_icon.png) no-repeat 0 20%;
    background-size: 15px;
    color: #666;
    text-align: left
}

.columnList .col_text span.dateBox {
    font-size: 10px;
    display: block;
    float: right;
    color: #CCC;
    text-align: left
}

.columnList .col_text a {
    color: #666
}

.columnList .col_text a:hover {
    text-decoration: underline
}

.yellow_line {
    background: rgba(0, 0, 0, 0) linear-gradient(transparent 60%, #ffff43 0) repeat scroll 0 0;
    font-weight: bold
}

.underBlock {
    overflow: hidden;
    padding: 0 0 30px
}

.underBlock .otherPhoto {
    padding: 15px 0 0 15px;
    width: 31%;
    float: left
}

.underBlock .otherPhoto img {
    width: 100%;
    height: auto
}

.underBlock .rightTxt {
    width: 67%;
    float: left
}