@charset "UTF-8";

body{}

.bg_ptn{ background:url(../img/cmn/ptn.png) top center repeat; }

.font_b46_w{ font-size: 46px !important; font-weight: bold; color: #FFF;}
.font_b28_w{ font-size: 28px; font-weight: bold; color: #FFF; display: block;}
.font_b20_w{ font-size: 20px; font-weight: bold; color: #FFF; display: block;}
.font_b14_w{ font-size: 20px; font-weight: bold; color: #FFF; display: block; }

.e-sec01{padding: 2em 0;}


ul.exhibition_menu{
text-align: center;
width: 100%;
list-style: none;
margin:0 auto 2em;
}

.w100_r{ width: 100% !important;
text-align: center !important;
margin: 20px auto 10px !important;
padding: -0 !important;
font-size: 1em !important;}


ul.exhibition_menu li { display: inline-block; width:32%; margin:0 1% 0 0;}

ul.exhibition_menu li a{}

ul.exhibition_menu li a.disable{background:#666;}
ul.exhibition_menu li a.disable:hover{background:#666; color: #FFF;}

ul.exhibition_menu li:last-child{ margin:0; }


.mainvisual{max-width: 1000px; width: 100%; height: 558px; 
background:
        url(../img/cmn/item_bg.png) repeat,
        url(../img/exhibition/udx_mainvisual.jpg)top center no-repeat;
margin: auto; display: table;
position: relative;
}

.mainvisual .box{ display: table-cell; vertical-align: middle; text-shadow: 0px 0px 5px #000;  }

.mainvisual span.u-text,
.mainvisual2 span.u-text
{ font-size: .8em; text-align: right; position: absolute; right: 1%; bottom:1%; display: block; text-shadow: 0px 0px 5px #000;}

.mainvisual2{max-width: 1000px; width: 100%; height: 558px; 
background:
        url(../img/cmn/item_bg.png) repeat,
        url(../img/exhibition/bellesalle_mainvisual.jpg)top center no-repeat;
margin: auto; display: table; position: relative;
}

.mainvisual2 .box{ display: table-cell; vertical-align: middle; text-shadow: 0px 0px 5px #000;  }

.mainvisual2 .box p span{ }

.inner2{
  max-width: 1000px;
  margin:0 auto;
}


ol.li_number{
    counter-reset: li;
    padding-top: 1em;
    list-style: none;
    padding-inline-start: 0;

}
/*ol.li_number li{
   position: relative;
   list-style-type:none;
   margin: 3px 5px 6px -20px;
   padding: 30px 40px 30px 60px;
   border-bottom: 1px solid #CCC;

}


ol.li_number li:before {
    counter-increment: li;
    content: counter(li);
    position: absolute;
    font-size: 60px;
    top: 16%;
    left: -0.4em;
    width: 1.6em;
    text-align: center;
    color: #00a0e9;
}*/

ol.li_number li p{ font-size: 24px; font-weight: bold; text-align: left; margin: 0; line-height: 1.3;}
ol.li_number li span{ font-size: 16px; display: block; padding-top: 10px; }


ul.li_number{
    counter-reset: li;
    padding-left: 16px;
    margin-left: 16px;
    list-style: none;

}
ul.li_number li{
   position: relative;
   list-style-type:none;
  margin: 2em auto;
  padding: 2em;
   border: 1px solid #CCC;

}

ul.li_number li p{ font-size: 24px; font-weight: bold; text-align: left; margin: 0; line-height: 1.3;}
ul.li_number li span{ font-size: 16px; display: block; padding-top: 10px; }


ul.e-item_box{ padding:20px; width: 600px; margin: auto; background: #333; border: 1px solid #999; }

ul.e-item_box li{display: inline-block; vertical-align: top; } 

ul.e-item_box li.e-item_thum{ max-width: 200px;}
ul.e-item_box li.e-item_text{ max-width: 360px; width: 360px;  margin-left:20px; }
ul.e-item_box li.e-item_text p{text-align: left !important;}


.maptit{font-weight: bold; font-size: 32px; color:#FFF; margin: 2em 0 0; line-height: 1.3; text-align: center;}

.maptit:after{ content: ""; display:block; height: 2px; width: 30px; background: #fff;
    margin: 15px auto 0 auto;}


/*画像リスト*/
ul.img_list{
  content: "";
  all: inherit;
  border: none;
  padding: 10px 0 0;
  margin: 0; text-align:left; }
ul.img_list li{ 
  content: "";
  all: inherit;
  border: none;
  display: inline-block; margin: 0 1% 0 0;
padding: 10px 0 0; width: 24%;}
ul.img_list li a{ display: block;}
ul.img_list li img{ max-height: 108px; padding-left: 1em; vertical-align: middle;}

/*画像リスト*/
ul.img_list_i{ margin: 2em 0 0; text-align: center;}
ul.img_list_i li{ display: inline-block; margin: 2% 0 0 0; width: 100%;}
ul.img_list_i li a{ display: block;}
ul.img_list_i li img{ max-height:160px; width: 100%; vertical-align: middle;}

ul.img_list li:before{
  content: "";
  all: inherit;
  counter-reset:li;
}


ul.thumimg li img{ height: 100%; max-height: 200px !important; max-width: 200px !important; width: 100%;}

ul.thumimg2 li img{ height: 100%; max-height: 200px !important; max-width: 200px !important; }

.showroom_box{ width: 100%; padding: 1em; border:1px solid #CCC; margin: 2em auto; text-align: left; }

.left-thum{}

@media screen and (min-width:640px) and (max-width:740px) {

  /*画像リスト*/
  ul.img_list li{ margin: 0 1% 0 0;}
  ul.img_list li:last-child{ margin-right: 0;}

  ul.img_list li img{ padding: 0;}
  ul.img_list_i li img{ max-height:80%; padding: 0;}
  ul.img_list li:nth-child(3n){ margin-right: 0;}
}


@media screen and (min-width:480px) and (max-width:640px) {

ul.e-item_box{ padding:20px; width: 80%; margin: auto; background: #333; text-align: center; }

ul.e-item_box li{display: inline-block; vertical-align: top; } 

ul.e-item_box li.e-item_thum{ max-width: 300px; margin: auto; text-align: center;}
ul.e-item_box li.e-item_thum img{ width: 300px;}

ul.e-item_box li.e-item_text{ max-width:100%;  margin-left:0; }
ul.e-item_box li.e-item_text p{text-align: left !important;}

ul.img_list li img{ max-height: 108px; max-width: 100%; padding-left: 0;}

}



@media screen and (min-width:200px) and (max-width:480px) {

 ul.img_list li img{ padding: 0; max-width: 100%; }
ul.exhibition_menu li { display: inline-block; width:100% !important; margin:0 0 1% 0;}


}


/*タブ切り替え全体のスタイル*/
.tabs {
  margin-top: 50px;
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;}

/*タブのスタイル*/
.tab_item {
  width: calc(100%/2);
  background-color: #d9d9d9;
 padding: 1em;
  text-align: center;
  color: #565656;
  display: block;
  float: left;
  text-align: center;
  font-weight: bold;
  transition: all 0.2s ease;
  margin: 0 auto 30px;
}
.tab_item:hover {
  opacity: 0.75;
}

/*ラジオボタンを全て消す*/
input[name="tab_item"] {
  display: none;
}

/*タブ切り替えの中身のスタイル*/
.tab_content {
  display: none;
  clear: both;
  overflow: hidden;
  padding: 2em;
}


/*選択されているタブのコンテンツのみを表示*/
#bell:checked ~ #bell_content,
#udx:checked ~ #udx_content {
  display: block;
}

/*選択されているタブのスタイルを変える*/
.tabs input:checked + .tab_item {
  background-color: #00a0e9;
  color: #fff;
}

.stit_grad{
  color: #ffc51c;//非対応のブラウザでの文字色を設定
  background: -webkit-linear-gradient(0deg, #ffc51c, #FFF);//背景色にグラデーションを指定
  -webkit-background-clip: text;//テキストでくり抜く
  -webkit-text-fill-color: transparent;//くり抜いた部分は背景を表示
}


.head_title {
    margin:  0;                     /* デフォルトCSS打ち消し */
    font-size:  24px;               /* 文字サイズ指定 */
    position:  relative;            /* 位置調整 */
    font-weight:  normal;           /* 文字の太さ調整 */
    margin-bottom: 15px;            /* 周りの余白指定 */
    padding-top: 50px;              /* 余白指定 */
    padding-left: 40px;             /* 余白指定 */
    font-weight: bold;
}

.head_title:after {
    content:  '';                   /* 空白の要素を作る */
    width: 0;                       /* 幅指定 */
    height: 0;                      /* 高さ指定 */
    border-style: solid;            /* 三角を作る */
    border-width: 0px 0 110px 80px; /* 三角を作る */
    border-color: transparent transparent #ff58a0 transparent;  /* 三角を作る */
    position:  absolute;            /* 位置調整 */
    z-index:  -1;                   /* 重なり調整 */
    transform: rotate(30deg);       /* 回転 */
    top: -20px;                     /* 位置調整 */
    left: 30px;                     /* 位置調整 */
}

.head_title:before {
    content:  '';                   /* 空白の要素を作る */
    width: 0;                       /* 幅指定 */
    height: 0;                      /* 高さ指定 */
    border-style: solid;            /* 三角を作る */
    border-width: 0px 0 95px 70px; /* 三角を作る */
    border-color: transparent transparent #666 transparent;  /* 三角を作る */
    position:  absolute;            /* 位置調整 */
    z-index:  -1;                   /* 重なり調整 */
    transform: rotate(40deg);       /* 回転 */
    top: -10px;                     /* 位置調整 */
    left: 60px;                     /* 位置調整 */
}

.head_title_g {
    margin:  0;                     /* デフォルトCSS打ち消し */
    font-size:  24px;               /* 文字サイズ指定 */
    position:  relative;            /* 位置調整 */
    font-weight:  normal;           /* 文字の太さ調整 */
    margin-bottom: 15px;            /* 周りの余白指定 */
    padding-top: 50px;              /* 余白指定 */
    padding-left: 40px;             /* 余白指定 */
    font-weight: bold;
}
.head_title_g:after {
    content:  '';                   /* 空白の要素を作る */
    width: 0;                       /* 幅指定 */
    height: 0;                      /* 高さ指定 */
    border-style: solid;            /* 三角を作る */
    border-width: 0px 0 110px 80px; /* 三角を作る */
    border-color: transparent transparent #00bd8e transparent;  /* 三角を作る */
    position:  absolute;            /* 位置調整 */
    z-index:  -1;                   /* 重なり調整 */
    transform: rotate(30deg);       /* 回転 */
    top: -20px;                     /* 位置調整 */
    left: 30px;                     /* 位置調整 */
}

.head_title_g:before {
    content:  '';                   /* 空白の要素を作る */
    width: 0;                       /* 幅指定 */
    height: 0;                      /* 高さ指定 */
    border-style: solid;            /* 三角を作る */
    border-width: 0px 0 95px 70px; /* 三角を作る */
    border-color: transparent transparent #666 transparent;  /* 三角を作る */
    position:  absolute;            /* 位置調整 */
    z-index:  -1;                   /* 重なり調整 */
    transform: rotate(40deg);       /* 回転 */
    top: -10px;                     /* 位置調整 */
    left: 60px;                     /* 位置調整 */
}


.head_title_b {
    margin:  0;                     /* デフォルトCSS打ち消し */
    font-size:  24px;               /* 文字サイズ指定 */
    position:  relative;            /* 位置調整 */
    font-weight:  normal;           /* 文字の太さ調整 */
    margin-bottom: 15px;            /* 周りの余白指定 */
    padding-top: 50px;              /* 余白指定 */
    padding-left: 40px;             /* 余白指定 */
    font-weight: bold;
}
.head_title_b:after {
    content:  '';                   /* 空白の要素を作る */
    width: 0;                       /* 幅指定 */
    height: 0;                      /* 高さ指定 */
    border-style: solid;            /* 三角を作る */
    border-width: 0px 0 110px 80px; /* 三角を作る */
    border-color: transparent transparent #00a0e9 transparent;  /* 三角を作る */
    position:  absolute;            /* 位置調整 */
    z-index:  -1;                   /* 重なり調整 */
    transform: rotate(30deg);       /* 回転 */
    top: -20px;                     /* 位置調整 */
    left: 30px;                     /* 位置調整 */
}

.head_title_b:before {
    content:  '';                   /* 空白の要素を作る */
    width: 0;                       /* 幅指定 */
    height: 0;                      /* 高さ指定 */
    border-style: solid;            /* 三角を作る */
    border-width: 0px 0 95px 70px; /* 三角を作る */
    border-color: transparent transparent #666 transparent;  /* 三角を作る */
    position:  absolute;            /* 位置調整 */
    z-index:  -1;                   /* 重なり調整 */
    transform: rotate(40deg);       /* 回転 */
    top: -10px;                     /* 位置調整 */
    left: 60px;                     /* 位置調整 */
}

.lead{text-align: center; color: #444; font-weight: bold; font-size: 24px;}


/* 0924 UDX */
ul.udx_boxlist{ width: 100%; }
ul.udx_boxlist li{ display: inline-block; list-style: none; width: 32%; margin:0 1% 1% 0; vertical-align: top; }
ul.udx_boxlist li:last-child{ margin: 0 0 1% 0; }
ul.udx_boxlist li img{max-height: 180px;}

@media screen and (min-width:200px) and (max-width:700px) {
.head_title,
.head_title_b,
.head_title_g{ font-size: 20px; }

.lead{text-align: center; color: #444; font-weight: bold; font-size: 18px; line-height: 1.8;}

ul.udx_boxlist li{ display: inline-block; list-style: none; width: 100%; margin:3% 0; text-align: center; }
ul.udx_boxlist li img{ max-width: 460px;}
}

.exhibition_copy{font-size: 12px !important; color: #CCC; text-align: center !important; font-weight: normal !important;}


/* 1002 UDX */
ul.udx_boxlist2{ width: 100%; }
ul.udx_boxlist2 li{ display: inline-block; list-style: none; width: 46%; margin:0 1% 1% 0; vertical-align: top; }
ul.udx_boxlist2 li:last-child{ margin: 0 0 1% 0; }
ul.udx_boxlist2 li img{max-height: 180px;}
ul.udx_boxlist2 li .nexttext{font-weight: normal; font-size: 3em;  text-align: center; padding-top: 1em; font-weight: bold;}

@media screen and (min-width:200px) and (max-width:700px) {
ul.udx_boxlist2 li{ display: inline-block; list-style: none; width: 100%; margin:3% 0; text-align: center; }
ul.udx_boxlist2 li img{ max-width: 460px;}

ul.udx_boxlist2 li .stit{font-weight: normal; font-size: 1.8em;  text-align: center; padding-top: 0; font-weight: bold;}
ul.udx_boxlist3 li .font14{font-size: 14px;}

}

/* 1009 UDX */
ul.udx_boxlist3{ width: 100%; }
ul.udx_boxlist3 li{ padding: .5em; /*border: 1px solid #666; background: #333;*/ display: inline-block; list-style: none; width: 32%; margin:0 1% 1% 0; vertical-align: top; }
ul.udx_boxlist3 li:last-child{ margin: 0 0 1% 0; }
ul.udx_boxlist3 li .font14{font-size: 1em; font-weight: normal;}
ul.udx_boxlist3 li .nexttext{font-weight: normal; font-size: 3em;  text-align: center; padding-top: 1em; font-weight: bold;}
ul.udx_boxlist3 li .s-copy{font-size: .7em; font-weight: normal;}
ul.udx_boxlist3 li .stitt{ background: #ff91c5; color:#FFF; font-weight: normal; font-size: 1em; padding: .5em;  text-align: center; font-weight: bold;}

@media screen and (min-width:200px) and (max-width:700px) {
ul.udx_boxlist3 li{ display: inline-block; list-style: none; width: 100%; margin:3% 0; text-align: center; }
ul.udx_boxlist3 li img{ max-width: 460px;}

ul.udx_boxlist3 li .stitt{font-weight: normal; font-size: 1em;  text-align: center; padding-top: 0; font-weight: bold;}
ul.udx_boxlist3 li .s-copy{font-size: .7em; font-weight: normal;}
ul.udx_boxlist3 li .font14{font-size: 1em; font-weight: normal;}
}

/* 1009 UDX */
ul.udx_boxlist4{ width: 100%; }
ul.udx_boxlist4 li{ padding: .5em; /*border: 1px solid #666; background: #333;*/ display: inline-block; list-style: none; width: 49%; margin:0 1% 1% 0; vertical-align: top; }
ul.udx_boxlist4 li:last-child{ margin: 0 0 1% 0; }
ul.udx_boxlist4 li .font14{font-size: 1em; font-weight: normal;}
ul.udx_boxlist4 li .nexttext{font-weight: normal; font-size: 3em;  text-align: center; padding-top: 1em; font-weight: bold;}
ul.udx_boxlist4 li .s-copy{font-size: .7em; font-weight: normal;}
ul.udx_boxlist4 li .stitt{ background: #ff91c5; color:#FFF; font-weight: normal; font-size: 1em; padding: .5em;  text-align: center; font-weight: bold;}

@media screen and (min-width:200px) and (max-width:700px) {
ul.udx_boxlist4 li{ display: inline-block; list-style: none; width: 100%; margin:3% 0; text-align: center; }
ul.udx_boxlist4 li img{ max-width: 460px;}

ul.udx_boxlist4 li .stitt{font-weight: normal; font-size: 1em;  text-align: center; padding-top: 0; font-weight: bold;}
ul.udx_boxlist4 li .s-copy{font-size: .7em; font-weight: normal;}
ul.udx_boxlist4 li .font14{font-size: 1em; font-weight: normal;}
}

/* 1023 UDX */
ul.udx_boxlist5{ width: 100%; }
ul.udx_boxlist5 li{ padding: .5em; /*border: 1px solid #666; background: #333;*/ display: inline-block; list-style: none; width: 64%; margin:0 1% 1% 0; vertical-align: top; }
ul.udx_boxlist5 li:last-child{ width: 34%; margin: 0 0 1% 0; }
ul.udx_boxlist5 li .font14{font-size: 1em; font-weight: normal;}
ul.udx_boxlist5 li .nexttext{font-weight: normal; font-size: 3em;  text-align: center; padding-top: 1em; font-weight: bold;}
ul.udx_boxlist5 li .s-copy{font-size: .7em; font-weight: normal;}
ul.udx_boxlist5 li .stitt{ background: #ff91c5; color:#FFF; font-weight: normal; font-size: 1em; padding: .5em;  text-align: center; font-weight: bold;}

@media screen and (min-width:200px) and (max-width:700px) {
ul.udx_boxlist5 li{ display: inline-block; list-style: none; width: 100%; margin:3% 0; text-align: center; }
ul.udx_boxlist5 li img{ max-width: 460px;}
ul.udx_boxlist5 li:last-child{ width: 80%; margin: auto; text-align: center; }
ul.udx_boxlist5 li .stitt{font-weight: normal; font-size: 1em;  text-align: center; padding-top: 0; font-weight: bold;}
ul.udx_boxlist5 li .s-copy{font-size: .7em; font-weight: normal;}
ul.udx_boxlist5 li .font14{font-size: 1em; font-weight: normal;}
}