@charset "utf-8";
/*=================================================
TOP PAGE
=================================================*/
#top #mainimage {
padding-top: 30px;
}
#top .bx-viewport {
min-height:600px!important;
}
#top .bx-viewport ul{
height: 100%;
}
#top .topsec {
}
#top .ttl_01 {
font-size: 30px;
letter-spacing: 0.2em;
position: relative;
line-height: 1;
display: inline-block;
margin-bottom: 10px;
}
#top .ttl_01:before {
content: "";
display: block;
height: 6px;
width: 60px;
margin: 12px 0;
position: absolute;
right: -80px;
top: 0;
background-color: #333;
}
/*-------------------------------------
NEWS / BLOG COMMON
--------------------------------------*/
#top .topicList li {
font-size: 13px;
line-height: 1.4;
border-bottom: 1px dotted #000;
}
#top .topicList li a {
padding: 20px 50px;
display: block;
}
#top .topicList li a:hover {
background: #efefef;
}
#top .topicList li:last-child {
border: none;
}
#top .viewmore {
text-align: right;
padding-right: 10px;
padding-top: 15px;
}
#top .viewmore a {
font-size: 11px;
font-weight: bold;
letter-spacing: 0.1em;
border: 1px solid #000;
padding: 10px 40px 10px 65px;
background: url(../Image/common/arrow_01.png) 40px center no-repeat #fff;
transition: .3s;
}
#top .viewmore a:hover {
background: url(../Image/common/arrow_03.png) 45px center no-repeat #000;
color: #fff;
}
/*-------------------------------------
SECTION 01 - NEWS
--------------------------------------*/
#top #sec_01 {
}
#top #sec_01 .ttl_01 {
color: #b92c2f;
}
#top #sec_01 .ttl_01:before {
background-color: #b92c2f;
}
#top #sec_01 #newsList .date {
float: left;
width: 88px;
padding-left: 18px;
background: url(../Image/common/icon_bean.png) left center no-repeat;
color: #6a3c0c;
font-size: 12px;
}
#top #sec_01 #newsList a:hover .date {
}
#top #sec_01 #newsList .ttl {
float: left;
width: 462px;
padding-left: 50px;
}
#top #sec_01 #newsList a:hover .ttl {
}
/*-------------------------------------
SECTION 02 - BLOG
--------------------------------------*/
#top #sec_02 {
padding: 40px 0;
}
#top #sec_02 .ttl_01 {
}
#top #sec_02 #blogList {
}
#top #sec_02 #blogList a {
}
#top #sec_02 #blogList .cat {
float: left;
font-size: 12px;
width: 106px;
color: #fff;
text-align: center;
}
#top #sec_02 #blogList .cat span{
background: #cb6c6c;
padding: 2px 0;
color: #fff;
display:block;
margin-bottom: 5px;
}
#top #sec_02 #blogList a:hover .cat {
}
#top #sec_02 #blogList .ttl {
float: left;
width: 462px;
padding-left: 50px;
}
#top #sec_02 #blogList a:hover .ttl {
}
#top #sec_02 .topbanner{
padding: 40px 0;
}
#top #sec_02 .topbanner li{
width: 48%;
float: left;
margin-right: 2%;
text-align: center;
float: left;
border: 1px solid #000;
background: url(../Image/top/media.png)no-repeat;
background-size: 50%;
height: 72px;
}
#top #sec_02 .topbanner li:last-child{
background: url(../Image/profile/bg01.png)no-repeat;
background-size: 50%;
margin-right: 0
}
#top #sec_02 .topbanner li a {
width: 100%;
}
#top #sec_02 .topbanner li .eng {
font-size: 14px;
color: #fff;
font-weight: bold;
display: block;
width: 50%;
float: left;
/* top: 50px; */
padding: 20px 0;
/* line-height: 40px; */
box-sizing: sub;
height: 72px;
vertical-align: baseline;
box-sizing: border-box;
}
#top #sec_02 .topbanner li .jpn {
display: block;
background: url(../Image/common/border.png) left top 30px no-repeat;
background-size: 0 1px;
transition: 0.3s;
width: 50%;
float: left;
height: 72px;
padding: 5px 0;
line-height: 2.3;
box-sizing: border-box;
}
#top #sec_02 .topbanner li a:hover .jpn {
background-size: 100% 1px;
}
/*-------------------------------------
SECTION 03 - ABOUT Unir
--------------------------------------*/
#top #sec_03 {
padding: 40px 0;
}
#top #sec_03 .ttl_02 {
text-align: center;
margin-bottom: 30px;
}
#top #sec_03 .ttl_02 .eng {
display: block;
font-size: 30px;
letter-spacing: 0.2em;
}
#top #sec_03 .ttl_02 .jpn {
display: block;
font-weight: normal;
color: #666666;
font-size: 14px;
padding-top: 5px;
}
#top #sec_03 #aboutList {
}
#top #sec_03 #aboutList li {
float: left;
margin-right: 32px;
width: 218px;
}
#top #sec_03 #aboutList li:last-child {
margin-right: 0;
}
#top #sec_03 #aboutList li a {
display: block;
}
#top #sec_03 #aboutList li .img {
position: relative;
margin-bottom: 20px;
}
#top #sec_03 #aboutList li .img img {
position: relative;
z-index: 10;
width: 100%;
}
#top #sec_03 #aboutList li .img:after {
content: "";
height: 210px;
width: 194px;
background: #b5b5b5;
position: absolute;
z-index: 5;
top: -6px;
left: 12px;
margin-bottom: 10px;
}
#top #sec_03 #aboutList li a:hover .img {
}
#top #sec_03 #aboutList li .caption {
font-size: 14px;
padding-bottom: 6px;
border-bottom: #fafaf5 7px solid;
margin-bottom: 20px;
text-align: center;
font-weight: bold;
}
#top #sec_03 #aboutList li a:hover .caption {
}
#top #sec_03 #aboutList li .txt {
font-size: 11px;
line-height: 1.4;
margin-bottom: 25px;
}
#top #sec_03 #aboutList li a:hover .txt {
}
#top #sec_03 #aboutList li .readmore {
font-size: 11px;
font-weight: bold;
letter-spacing: 0.1em;
border: 1px solid #000;
padding: 10px 0 10px 75px;
background: url(../Image/common/arrow_01.png) 50px center no-repeat #fff;
transition: .3s;
}
#top #sec_03 #aboutList li a:hover .readmore {
background: url(../Image/common/arrow_03.png) 55px center no-repeat #000;
color: #fff;
}
/*-------------------------------------
SECTION 04 - SNS BANNER
--------------------------------------*/
#top #sec_04 {
padding: 40px 0;
}
#top #sec_04 #sns_bnr {
}
#top #sec_04 #sns_bnr li {
float: left;
width: 352px;
margin-right: 14px;
margin-bottom: 14px;
}
#top #sec_04 #sns_bnr li:nth-child(2n) {
margin-right: 0;
}
#top #sec_04 #sns_bnr li:nth-last-child(-n+2) {
margin-bottom: 0;
}
#top #sec_04 #sns_bnr li a {
display: block;
}
#top #sec_04 #sns_bnr li img {
width: 100%;
height: auto;
}
#top #sec_04 #sns_bnr li a:hover img {
}
/*=================================================
UNDER 下層ページ共通
=================================================*/
.under #mainimage {
background: url(../Image/about-unir/bg01.jpg) center top repeat-x;
min-height: 250px;
background-size: cover;
background-attachment: fixed;
position: relative;
}
.under #mainimage h1 {
width: 1100px;
color: #fff;
font-size: 40px;
letter-spacing: 0.3em;
line-height: 1;
margin: 0 auto;
text-align: right;
padding: 28px 0 20px;
}
.under #mainimage .h1_wrap {
line-height: 1.6;
color: #fff;
width: 100%;
background-color: rgba(0, 0, 0, 0.57);
position: absolute;
top: 50%;
-webkit-transform: translate(0, -50%);
-moz-transform: translate(0, -50%);
-ms-transform: translate(0, -50%);
-o-transform: translate(0, -50%);
transform: translate(0, -50%);
}
.under .ttl_01 {
font-size: 30px;
letter-spacing: 0.15em;
position: relative;
line-height: 2;
display: inline-block;
margin-bottom: 10px;
margin-left: 20px;
}
.under .ttl_01:before {
content: "";
display: block;
height: 6px;
width: 60px;
margin: 12px 0;
position: absolute;
right: -80px;
top: 0;
background-color: #333;
margin-top: 28px;
}
/*=================================================
ABOUT UNOR
=================================================*/
#about-unir section strong {
background: linear-gradient(transparent 30%, #f1e6d4 30%);
}
#about-unir p.bold{
font-weight:bold;
font-size: 1.3em;
}
#about-unir section {
margin-bottom: 100px;
border-bottom: dashed 1px #333;
padding-bottom: 100px;
}
#about-unir section:last-child{
border-bottom:none;
}
#about-unir .sec_txt {
padding: 10px;
}
#about-unir .img_wrap {
padding:30px 0;
}
#about-unir #sec_02 .img_wrap {
width:80%;
margin:0 auto;
}
#about-unir .img_wrap img {
width:100%;
}
#about-unir #sec_04 .img_wrap {
}
#about-unir #sec_04 .sec_txt_wrap {
}
/*=================================================
PROFILE
=================================================*/
#profile section hr {
height: 6px;
width: 60px;
margin: 12px 0;
margin-bottom: 40px;
right: -80px;
top: 0;
background-color: #333;
}
#profile #sec_01 {
margin-bottom: 100px;
}
#profile .sec_box {
border: solid 1px #bd8e4b;
border-top: solid 8px #bd8e4b;
}
#profile .sec_box h2 {
border-bottom: solid 1px #bd8e4b;
text-align: center;
font-size: 32px;
line-height: 1;
padding: 50px 0;
}
#profile .prof {
padding: 30px;
margin-bottom: 50px;
}
#profile #sec_01 .prof {
margin-bottom: 0;
}
#profile .prof .prof_img {
width: 220px;
border-radius:120px;
overflow:hidden;
float:left;
margin-right:36px;
}
#profile .prof .prof_img img{
width: 100%;
}
#profile .prof dl {
float: left;
width: 400px;
}
#profile .prof dl dt {
font-size: 22px;
font-weight: bold;
border-bottom: dashed 1px #333;
padding: 10px;
}
#profile .prof dl dt span {
font-size: 13px;
font-weight: bold;
position: relative;
bottom:2px;
}
#profile .prof dl dt span:before {
content: '／';
margin-left: 10px;
margin-right: 5px;
}
#profile .prof dl dd {
padding-top: 20px;
}
#profile #sec_01 .prof dl dd ul li{
background: url(../Image/common/icon_bean.png) left 15px no-repeat;
font-weight: bold;
padding:10px 0 10px 25px;
}
#profile .prof_txt {
font-size: 14px;
line-height: 2;
color: #0e0b0a;
font-weight: 600;
}
#profile #sec_01 .prof_txt {
padding:15px 50px 80px;
}
#profile #sec_02 .prof_txt {
padding:30px 50px;
}
#profile #sec_02 dl dd table th,
#profile #sec_02 dl dd table td {
text-align: left;
}
#profile #sec_02 dl dd table th {
background: url(../Image/common/icon_bean.png) left center no-repeat;
padding:10px 10px 10px 25px;
width:65%;
}
#profile #sec_02 dl dd table td {
width:35%;
padding:10px 10px 10px 15px;
color: #b92c2f;
font-weight: 600;
vertical-align:top;
}
#profile .trophy_wrap {
text-align:center;
}
#profile .trophy {
width:500px;
position: relative;
display: inline-block;
overflow: hidden;
box-sizing: border-box;
text-align: center;
margin-top: 30px;
padding: 10px;
}
#profile .trophy:after {
content: "";
position: absolute;
z-index: 1;
width: 200px;
height: auto;
background: #b52124;
content: "受賞トロフィー";
text-align: center;
color: #fff;
font-family: 'Arial';
font-weight: bold;
padding: 5px 10px;
left: -40px;
top: 20px;
transform: rotate(-30deg);
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
}
#profile .trophy img{
width: 100%;
margin-top: 0;
}
#profile #sec_02 div.prof:nth-child(2n+1) dl {
float: right;
}
#profile #sec_02 div.prof:nth-child(2n+1) .prof_img {
float:right;
margin-left:36px;
margin-right:0;
}
#profile h3 {
font-size: 32px;
text-align: center;
padding-bottom: 20px;
border-bottom: 1px solid #111;
letter-spacing:0.1em;
margin-bottom: 20px;
}
#profile .img_box {
padding:0 50px 50px;
}
#profile .img_box ul{
padding:30px 0;
}
#profile .img_box li{
width:30%;
margin-right: 4%;
margin-bottom:7%;
float: left;
text-align: center;
}
#profile .img_box li h3{
font-size: 15px;
font-weight: bold;
border-bottom: dashed 1px #333;
padding: 20px 0 0 0;
width: 150px;
margin: 0 auto;
margin-bottom: 10px;
}
#profile .img_box li:nth-child(3n){
margin-right:0;
}
#profile .img_box li img{
border-radius:50%;
overflow:hidden;
width:100%;
}
/*=================================================
COMPANY
=================================================*/
#company .logo {
width: 100%;
text-align: center;
margin-bottom: 50px;
}
#company .logo img {
width: 200px;
}
#company section {
padding: 35px;
padding-bottom: 60px;
margin-bottom: 100px;
clear: both;
}
#company section .sheet_01 {
font-size: 14px;
margin-top: 30px;
margin-left: 80px;
}
#company section .sheet_01 dt {
font-weight: bold;
float: left;
width: 20%;
margin-bottom: 20px;
padding-right: 20px;
}
#company section .sheet_01 dd {
padding: 0px 0px 20px 40px;
border-bottom: 1px dotted #fff;
float: left;
width: 60%;
border-left: 3px solid #eee9dc;
margin-bottom: 20px;
}
#company h2 {
font-size: 30px;
letter-spacing: 0.2em;
position: relative;
line-height: 1;
display: inline-block;
margin-bottom: 40px;
}
/*#company #sec_01 .ttl_01 {
color: #b92c2f;
}*/
#company .ttl_01:before {
content: "";
display: block;
height: 6px;
width: 60px;
margin: 12px 0;
position: absolute;
right: -80px;
top: 0;
background-color: #333;
}
#company .com_txt {
font-weight: bold;
padding-left: 60px;
}
#company .com_txt li {
background: url(../Image/common/icon_bean.png) left 15px no-repeat;
padding-left: 20px;
line-height: 3.2;
}
/* -----------
* timeline
* ---------- */
#company #timeline {
list-style: none;
margin: 50px 0px 0 200px;
padding-left: 30px;
border-left: 8px solid #eee9dc;
}
#company #timeline li {
margin: 40px 0;
position: relative;
}
#company #timeline p {
margin: 0 0 15px;
}
#company .date {
margin-top: -10px;
top: 50%;
left: -158px;
line-height: 20px;
position: absolute;
font-weight: bold;
}
#company .circle {
margin-top: -10px;
top: 50%;
left: -44px;
width: 10px;
height: 10px;
background: #b52124;
border: 5px solid #eee9dc;
border-radius: 50%;
display: block;
position: absolute;
}
#company .content {
max-height: 20px;
padding: 50px 20px 0;
border-color: transparent;
border-width: 2px;
border-style: solid;
border-radius: 0.5em;
position: relative;
}
#company .content:before, .content:after {
content: "";
width: 0;
height: 0;
border: solid transparent;
position: absolute;
pointer-events: none;
right: 100%;
}
#company .content:before {
border-right-color: inherit;
border-width: 20px;
top: 50%;
margin-top: -20px;
}
#company .content:after {
border-right-color: #b52124;
border-width: 10px;
top: 67%;
margin-top: -17px;
margin-left: 30px;
}
#company .content p {
max-height: 0;
color: transparent;
text-align: justify;
word-break: break-word;
hyphens: auto;
overflow: hidden;
}
#company label {
position: absolute;
z-index: 100;
cursor: pointer;
top: 18px;
transition: transform 0.2s linear;
padding-left: 40px;
}
/*=================================================
BLOG
=================================================*/
#blog section a {
line-height: 2;
}
#blog #sec_02 li a{
margin-bottom: 10px;
}
#blog article ul {
margin-top: 10px;
margin-left: 20px;
}
#blog section li:last-child {
border-bottom: none;
}
#blog .categoly {
margin-bottom: 20px
}
#blog.newlist {
margin-bottom: 45px
}
#blog.log {
margin-bottom: 45px
}
.over {
text-rendering: auto;
color: initial;
letter-spacing: normal;
word-spacing: normal;
text-transform: none;
text-indent: 0px;
text-shadow: none;
display: inline-block;
text-align: start;
margin: 0em 0em 0em 0em;
}
#blog .title_bar {
margin-bottom: 45px;
}
#blog .blog_box {
border-bottom: dotted 1px #737272;
margin-bottom: 30px;
}
#blog .blog_box:last-child {
border: none;
}
#blog .blog_box_01 {
margin-bottom: 30px;
}
#blog .post_date {
float: left;
font-weight: bold;
margin-right: 20px;
text-align: center;
padding-top: 12px;
}
#blog .post_date:last-child {
border-bottom: none;
padding: 10px 0;
}
.post_date_year {
height: 30px;
color: #fff;
background: #000000;
line-height: 30px;
}
.post_date_month {
width: 70px;
height: 60px;
color: #000000;
display: table-cell;
vertical-align: middle;
border: 1px solid #000;
}
.post_info {
width: 600px;
float: left;
}
#blog h3 {
margin-bottom: 30px;
font-size: 18px;
background: url(../Image/common/icon_bean.png) left 8px no-repeat;
padding-left: 20px;
}
#blog #sec_01 li a{
text-decoration: none;
}
#blog #sec_01 p.ttl{
font-size:14px;
font-weight: bold;
padding-bottom: 10px;
text-align: left;
}
#blog #sec_01 p.blog_txt{
font-size:10px;
text-align: left;
}
#blog .blog_box .post_title {
float: left;
line-height: 1.2;
padding-bottom: 10px;
padding-top: 3px;
font-size: 16px;
}
#blog .blog_content {
font-size: 10px;
float: left;
text-align: left;
}
#blog .blog_content span{
display:inline-block;
background: #bc5756;
padding: 4px 10px;
margin-right:5px;
margin-bottom:5px;
}
#blog .blog_content a {
color: #fff;
}
#blog .blog_box .blog_txt {
padding: 0 20px 20px 0;
}
#blog .newlist {
padding-bottom: 30px;
padding-top: 20px;
}
#blog .categoly {
padding-bottom: 30px;
width: 50%;
float: left;
}
#blog .log {
border-top: 1px #000;
padding-bottom: 30px;
width: 48%;
float: left;
margin-left: 10px;
}
#blog #sec_01, #blog #sec_01 #sec_02 {
}
#blog .sec_ttl {
font-size: 40px;
font-weight: normal;
font-family: 'Great Vibes', cursive;
letter-spacing: 0.1em;
line-height: 1;
text-align: center;
margin-bottom: 40px;
}
#blog .sec_ttl hr {
width: 50px;
border-top: #333 1px solid;
margin: 30px auto 0;
}
#blog #sec_01 .news_date{
background: url(../Image/common/icon_bean.png)no-repeat left bottom 5px;
padding-left: 10px;
width: 70px;
float: left;
margin-right: 10px;
}
#blog #sec_01 .box_list{
width: 200px;
margin-right: 30px;
margin-bottom: 60px;
float: left;
padding: 20px;
box-sizing: border-box;
background: #382628;
background: linear-gradient(135deg, rgba(0,0,0,0) 5px, #e7e7e2 0) top left,linear-gradient(225deg, rgba(0,0,0,0) 5px, #f7f7f3 0) top right,linear-gradient(315deg, rgba(0,0,0,0) 5px, #f9f9f9 0) bottom right,linear-gradient(45deg, rgba(0,0,0,0) 5px, #f9f9f9 0) bottom left;
background-size: 40% 55%;
background-repeat: no-repeat;
text-align: center;
}
#blog #sec_01 .box_list:nth-child(3n){
margin-right:0;
}
#blog #sec_01 .box_list .box_img{
width:150px;
height:150px;
padding-top: 10px;
overflow: hidden;
padding-bottom: 10px;
}
#blog #sec_01 .box_list .box_img a{
display:block;
width:100%;
height:100%;
}
#blog #sec_01 .box_list .box_img img{
position: relative;
left: 50%;
top: 50%;
width: auto;
height: 100%;
max-width: none;
max-height: none;
max-width: none;
-webkit-transform: translate(-50%,-50%);
-moz-transform: translate(-50%,-50%);
-ms-transform: translate(-50%,-50%);
-o-transform: translate(-50%,-50%);
transform: translate(-50%,-50%);
}
#blog #sec_01 .list_wrap .box_list .listBottom {
padding-top: 15px;
}
#blog #sec_01 .list_wrap .box_list .listBottom h3 {
font-size: 12px;
line-height: 1.5;
margin-bottom: 10px;
}
#blog #sec_01 .list_wrap .box_list .listBottom p {
font-size: 11px;
padding-top: 20px;
}
#blog #media_contact{
text-align:right;
margin-bottom:30px;
}
#blog #media_contact a{
padding: 10px 30px;
background: #fff;
color: #000;
border: 1px solid #000;
transition:.5s;
}
#blog #media_contact a:hover{
background: #000;
color: #fff;
}
/*=================================================
blog_single
=================================================*/
#blog_single section a {
line-height: 2;
}
#blog_single #sec_02 li a{
margin-bottom: 10px;
}
#blog_single article ul {
margin-top: 10px;
margin-left: 20px;
}
#blog_single .new_icon {
float: left;
font-size: 10px;
font-weight: bold;
text-align: center;
width: 50px;
height: 22px;
color: #b52124;
border: 1px solid;
line-height: 20px;
margin: 8px;
padding: 3px 0 0 0;
}
#blog_single.newlist {
margin-bottom: 45px;
padding-top: 20px;
}
#blog_single .news_txt {
margin-bottom: 50px;
min-height: 400px;
/* border-bottom: 5px solid #000; */
width: 100%;
margin-bottom: 60px;
float: left;
padding:100px 50px;
box-sizing: border-box;
background: #382628;
background: linear-gradient(135deg, rgba(0,0,0,0) 5px, #e7e7e2 0) top left,linear-gradient(225deg, rgba(0,0,0,0) 5px, #f7f7f3 0) top right,linear-gradient(315deg, rgba(0,0,0,0) 5px, #f9f9f9 0) bottom right,linear-gradient(45deg, rgba(0,0,0,0) 5px, #f9f9f9 0) bottom left;
background-size: 55% 2%;
background-repeat: no-repeat;
/* text-align: center; */
}
#blog_single .news_txt p{
margin-bottom:30px;
}
#blog_single .blog_img{
width:100%;
text-align: center;
}
#blog_single .blog_img img{
width:100%;
height: auto;
text-align: center;
margin-bottom: 30px;
}
#blog_single.log {
margin-bottom: 45px
}
#blog_single .title_bar {
margin-bottom: 45px;
}
#blog_single .blog_single_box {
border-bottom: dotted 1px #737272;
margin-bottom: 30px;
}
#blog_single .blog_single_box_01 {
margin-bottom: 30px;
}
#blog_single .post_date {
float: left;
font-weight: bold;
margin-right: 20px;
text-align: center;
padding-top: 2px;
padding-bottom: 10px;
}
.post_date_year {
height: 30px;
color: #fff;
background: #000000;
line-height: 30px;
}
.post_date_month {
width: 70px;
height: 60px;
color: #000000;
display: table-cell;
vertical-align: middle;
}
#blog_single #sec_02 h3,
#blog_single #sec_03 h3,
#blog_single #sec_04 h3 {
margin-bottom: 30px;
font-size: 18px;
width: 100%;
padding-left: 10px;
float: left;
background: url(../Image/common/icon_bean.png) left 8px no-repeat;
padding-left: 20px;
box-sizing: border-box;
}
#blog_single h3.news_title_01 {
margin-bottom: 30px;
font-size: 18px;
background: none;
padding-left: 0;
float: left;
width: 90%;
padding-top: 30px;
box-sizing: border-box;
}
#blog_single h4 {
background: url(../Image/common/icon_bean.png) left 8px no-repeat;
padding-left: 20px;
}
#blog_single .blog_single_box .post_title {
float: left;
line-height: 1.2;
padding-bottom: 10px;
padding-top: 3px;
font-size: 16px;
}
#blog_single .blog_single_box .blog_single_content {
float: left;
font-size: 10px;
background: #bc5756;
padding: 4px 10px;
}
#blog_single .blog_single_box .blog_single_content a {
color: #fff;
}
#blog_single .blog_single_box .blog_single_txt {
padding: 0 20px 20px 0;
}
#blog_single .newlist {
padding-bottom: 30px;
}
#blog_single .categoly {
padding-bottom: 30px;
width: 50%;
float: left;
}
#blog_single .log {
border-top: 1px #000;
padding-bottom: 30px;
width: 48%;
float: left;
margin-left: 10px;
}
#blog_single #sec_01, #blog_single #sec_02 {
}
#blog_single .blog_content {
float: left;
font-size: 10px;
}
#blog_single .blog_content span{
background: #bc5756;
padding: 4px 10px;
display:inline-block;
margin-right:5px;
}
#blog_single .blog_content a {
color: #fff;
text-decoration: none;
}
#blog_single .shareBtn {
text-align:right;
padding-bottom:35px;
}
#blog_single .shareBtn ul li {
display: inline-block;
vertical-align: top;
margin-left: 15px;
}
/*=================================================
SHOP 一覧
=================================================*/
#shop section {
padding-top: 50px;
padding-bottom: 50px;
}
#shop .shop_left p {
text-align: center;
padding: 5px;
font-size: 18px;
width: 200px;
}
#shop .img_left {
width: 350px;
float: right;
padding: 0 10px;
}
#shop .img_left img {
width: 300px;
padding: 0 10px 20px 10px;
}
#shop h2 {
font-size: 30px;
letter-spacing: 0.15em;
position: relative;
line-height: 2;
display: inline-block;
margin-bottom: 30px;
display: block;
}
#shop p.red{
float: left;
font-size: 10px;
background: #bc5756;
padding: 4px 10px;
color: #fff;
font-weight: bold;
margin: 15px;
}
#shop .shop_txt p {
margin-bottom: 2.4em;
}
#shop .shop_guide {
background:rgba(226, 232, 160, 0.23);
padding: 20px;
width: 300px;
background-image: linear-gradient(90deg, rgba(204,204,204,0) 0%, rgba(204,204,204,0) 49%, rgba(255,255,255,100) 50%, rgba(255,255,255,100) 100%), linear-gradient(180deg, rgba(204,204,204,0) 0%, rgba(204,204,204,0) 98.5%, rgba(100,100,100,100) 100%);
background-repeat: repeat-x, repeat-y;
background-size: 4px 100%, 100% 2.4em;
line-height: 2.4;
float: left;
min-height: 160px;
}
#shop .shop_guide:first-child {
padding: 10px 20px;
}
#shop .shop_guide dt {
width: 20%;
float: left;
font-weight: bold;
padding-right: 5px;
}
#shop .shop_guide dd {
width: 70%;
float: left;
}
#shop .shop_other {
text-align: center;
font-size: 18px;
font-weight: bold;
width: 50%;
float: left;
margin-bottom: 50px;
}
#shop .viewmore {
padding: 10px 0 0 10px;
}
#shop .viewmore a {
font-size: 11px;
font-weight: bold;
letter-spacing: 0.1em;
border: 1px solid #000;
padding: 10px 40px 10px 65px;
background: url(../Image/common/arrow_01.png) 20px center no-repeat #fff;
transition: .3s;
text-align: center;
}
#shop .viewmore a:hover {
background: url(../Image/common/arrow_03.png) 30px center no-repeat #000;
color: #fff;
}
#shop .viewmore {
}
#shop .viewmore a {
font-size: 11px;
font-weight: bold;
letter-spacing: 0.1em;
border: 1px solid #000;
padding: 10px 40px 10px 65px;
background: url(../Image/common/arrow_01.png) 40px center no-repeat #fff;
transition: .3s;
text-align: center;
width: 195px;
}
#shop .viewmore a:hover {
background: url(../Image/common/arrow_03.png) 40px center no-repeat #000;
}
#shop h2 span {
font-size: 13px;
font-weight: 500;
position: relative;
bottom:2px;
}
#shop h2 span:before {
content: '／';
margin-left: 15px;
margin-right: 5px;
}
/*=================================================
SHOP 詳細
=================================================*/
#shop_single section {
padding-top: 50px;
padding-bottom: 50px;
}
#shop_single #sec_01 .inner_01{
margin-bottom:30px;
}
#shop_single .shop_txt {
background: rgba(226, 232, 160, 0.4);
padding: 40px 20px;
width: 100%;
padding: 25px;
margin: 0;
background-image: linear-gradient(90deg, rgba(204,204,204,0) 0%, rgba(204,204,204,0) 49%, rgba(255,255,255,100) 50%, rgba(255,255,255,100) 100%), linear-gradient(180deg, rgba(204,204,204,0) 0%, rgba(204,204,204,0) 98.5%, rgba(100,100,100,100) 100%);
background-repeat: repeat-x, repeat-y;
background-size: 4px 100%, 100% 2.4em;
line-height: 2.4;
float: left;
box-sizing: border-box;
}
#shop_single .shop_left p {
text-align: center;
font-size: 18px;
width: 200px;
}
#shop_single .img_left {
width: 40%;
float: left;
}
#shop_single .img_left img {
width: 100%;
padding-bottom: 4%;
}
#shop_single h2 {
font-size: 250%;
font-weight: bold;
text-align: center;
padding-bottom: 30px;
border-bottom: 1px solid #111;
margin-bottom: 50px;
}
#shop_single #sec_02 h2 {
margin-bottom: 60px;
}
#shop_single .shop_txt p {
}
#shop_single .shop_guide {
clear: both;
float: left;
margin-top: 50px;
padding: 33px;
border: 3px #000;
background: #f5f5f5;
box-sizing: border-box;
line-height:2;
margin-bottom: 50px;
}
#shop_single .shop_guide dt {
width: 15%;
float: left;
padding: 10px;
font-weight: bold;
}
#shop_single .shop_guide dd {
width: 75%;
float: left;
padding: 10px 0 10px 40px;
border-left: 5px solid #fff;
margin-bottom: 20px;
}
#shop_single .shop_guide #sec_03 dd {
width: 100%;
float: left;
padding: 10px;
border-left: 3px solid #fff;
margin-bottom: 20px;
}
#shop_single .shop_guide #sec_04 dd {
width: 100%;
float: left;
padding: 10px;
}
#shop_single #sec_01 ul.intro{
}
#shop_single #sec_01 li {
width: 30%;
padding-right: 4%;
float: left;
}
#shop_single #sec_01 li h3{
text-align: center;
font-size: 15px;
font-weight: bold;
border-bottom: dashed 1px #333;
padding: 20px 0;
margin-bottom: 20px;
}
#shop_single #sec_01 li p{
font-size: 12px;
margin-bottom: 20px;
line-height: 2;
}
#shop_single #sec_01 li img {
width:100%;
margin-top: 10px;
}
#shop_single #sec_01 li:last-child{
padding-right: 0;
}
#shop_single li.shop_other {
text-align: center;
font-size: 18px;
font-weight: bold;
width:21%;
margin-right:5%;
float: left;
margin-bottom: 50px;
}
#shop_single li.shop_other:last-child{
margin-right: 0;
}
#shop_single #sec_02 img {
padding-top: 20px;
width:100%;
}
#shop_single .viewmore a {
font-size: 11px;
font-weight: bold;
letter-spacing: 0.1em;
border: 1px solid #000;
padding: 10px 0;
background: url(../Image/common/arrow_01.png) 20px center no-repeat #fff;
transition: .3s;
text-align: center;
width: 100%;
margin-top: 10px;
}
#shop_single .viewmore a:hover {
background: url(../Image/common/arrow_03.png) 25px center no-repeat #000;
color: #fff;
}
#shop_single li h3 span {
font-size: 13px;
font-weight: 500;
position: relative;
}
#shop_single li h3 span:before {
content: '／';
margin-left: 15px;
margin-right: 5px;
}
/*/******SHOP SLIDE***/
#shop_single #slideshow {
margin: 0 auto;
width: 718px;
height: auto;
text-align: left;
}
#shop_single #slideshow img {
width: 718px;
height: auto;
}
#shop_single #slideshow div {
overflow: hidden;
width: 718px;
min-height: 350px;
max-height: 400px;
position: relative;
}
#shop_single #slideshow div {
overflow: hidden;
width: 718px;
min-height: 350px;
max-height: 400px;
position: relative;
}
#shop_single #slideshow div div {
top: 0;
left: 0;
position: absolute;
width: 718px;
height: auto;
}
#shop_single #slideshow ul {
width: 718px;
height: auto;
}
#shop_single #slideshow ul li {
width: 134px;
padding:0px 12px 12px 0px;
height: auto;
float: left;
}
#shop_single #slideshow ul li:last-child{
padding:0px;
height: auto;
}
#slideshow .active {
filter:alpha(opacity=100)!important;
-moz-opacity: 1!important;
opacity: 1!important;
}
#shop_single .mgb0{
margin-bottom: 0!important;
}
#shop_single a.under_line{
text-decoration:underline;
font-size: 14px;
font-weight: bold;
color:darkred;
}
/*
#shop_single ul#gallery {
width:100%;
height: auto;
}
#shop_single ul#gallery li {
width: 134px;
padding:0px 12px 12px 0px;
height: auto;
float: left;
}
#shop_single ul#gallery li.end {
padding:0px;
height: auto;
}
#shop_single ul#gallery li img {
height: 67px;
}*/
/*************************************************
WHOLE SALE
************************************************/
#forbusiness .ttl_03{
text-align:center;
margin-bottom: 60px;
}
#forbusiness .ttl_03 h3{
font-size: 24px;
font-weight: bold;
border-bottom: 2px solid #000;
padding-bottom: 5px;
width: 170px;
margin: auto;
margin-bottom: 10px;
}
#forbusiness .ttl_04{
text-align: center;
font-size: 18px;
font-weight: bold;
margin-bottom: 30px;
}
#forbusiness #sec_01 ul{
margin: 10px;
padding: 20px 60px;
text-align: center;
border: 5px #bd8e4b solid;
position: relative;
z-index: 100;
background: #fff;
text-align: -webkit-left;
line-height: 30px;
margin-bottom: 60px;
}
#forbusiness #sec_01 ul::before {
content: "" ;
position: absolute ;
top: 0 ;
right: 0 ;
bottom: 0 ;
left: 0 ;
border: 2px #bd8e4b solid ;
margin: 2px ;
display: block ;
z-index: -1 ;
background: #fff ;
}
#forbusiness #sec_01 ul::after {
content: "" ;
position: absolute ;
top: 0 ;
right: 0 ;
bottom: 0 ;
left: 0 ;
border: 2px #bd8e4b solid ;
margin: 2px ;
display: block ;
z-index: -5 ;
background: #fff ;
border-radius: 50% ;
}
#forbusiness #sec_01 ul li{
list-style: circle;
}
#forbusiness #sec_01 ul li:last-child{
list-style:none;
text-align: -webkit-right;
}
#forbusiness #sec_01 .want_unir{
width: 100%;
height: 100px;
border: 1px solid #000;
margin-bottom: 20px;
}
#forbusiness section span.eng{
width:40%;
text-align: center;
float: left;
height: 100px;
padding: 20px;
box-sizing: border-box;
}
#forbusiness section span.eng strong{
font-size: 18px;
}
#forbusiness #sec_01 .last span.eng{
padding: 7px;
box-sizing: border-box;
}
#forbusiness #sec_01 .want_unir a{
width:100%;
}
#forbusiness #sec_01 span.want_txt{
width: 60%;
text-align: center;
float: left;
/* width: 40%; */
text-align: center;
float: left;
height: 100px;
padding: 30px;
box-sizing: border-box;
color: #fff;
font-weight: bold;
}
#forbusiness #sec_01 .want_unir a:hover{
color:#b52124;
transition: 0.3s;
}
#forbusiness #sec_01 span.want01{
background:url(../Image/whole-sale/forbusi_01b.jpg)no-repeat;
}
#forbusiness #sec_01 a:hover span.want01{
background:url(../Image/whole-sale/forbusi_01.jpg)no-repeat;
transition: 0.4s;
}
#forbusiness #sec_01 span.want02{
background:url(../Image/whole-sale/forbusi_02b.jpg)no-repeat;
}
#forbusiness #sec_01 a:hover span.want02{
background:url(../Image/whole-sale/forbusi_02.jpg)no-repeat;
transition: 0.4s;
}
#forbusiness #sec_01 span.want03{
background:url(../Image/whole-sale/forbusi_03b.jpg)no-repeat;
}
#forbusiness #sec_01 a:hover span.want03{
background:url(../Image/whole-sale/forbusi_03.jpg)no-repeat;
transition: 0.4s;
}
#forbusiness #sec_01 span.want04{
background:url(../Image/whole-sale/forbusi_04b.jpg)no-repeat;
}
#forbusiness #sec_01 a:hover span.want04{
background:url(../Image/whole-sale/forbusi_04.jpg)no-repeat;
transition: 0.4s;
}
#forbusiness #sec_01 .help{
margin-bottom:60px;
width: 100%;
text-align: -webkit-center;
}
#forbusiness #sec_01 .help img{
margin: 0 auto;
}
/*** section02 */
#forbusiness #sec_02 .ttl_05{
width: 40%;
float: left;
text-align: center;
border-right: 6px solid #000;
}
#forbusiness #sec_02 span.eng {
width:100%;
}
#forbusiness #sec_02 .ttl05_txt{
width: 58%;
float: left;
padding: 0 50px;
box-sizing: border-box;
line-height: 24px;
}
#forbusiness #sec_02 ul{
padding:30px 0;
}
#forbusiness #sec_02 li{
height: 260px;
}
#forbusiness #sec_02 li:first-child {
height: 360px;
}
#forbusiness #sec_02 p span{
padding-left: 1em;
}
#forbusiness #sec_02 .box{
width:70%;
float: left;
}
#forbusiness #sec_02 .graf_box{
width:50%;
float: left;
}
#forbusiness #sec_02 p{
padding:0 20px;
}
#forbusiness #sec_02 p.small{
padding: 0;
}
#forbusiness p.small{
font-size:11px;
padding: 0;
}
#forbusiness #sec_02 p.number{
padding: 10px;
font-size: 18px;
font-weight: bold;
}
#forbusiness #sec_02 .img_box{
width:30%;
box-sizing: border-box;
float: left;
text-align: center;
}
#forbusiness #sec_02 li .graf{
width:50%;
box-sizing: border-box;
float: left;
text-align: center;;
}
#forbusiness #sec_02 .img_box img{
width:100%;
}
#forbusiness #sec_02 .graf img{
width:100%;
}
#forbusiness #sec_02 .other_shop {
border-top:1px solid#000;
padding-top:10px;
margin-bottom: 30px;
}
#forbusiness #sec_02 .other_shop .img_box{
width:20%;
}
#forbusiness #sec_02 .other_shop .txt_box{
width: 80%;
padding-left:10px;
float: left;
height: 143px;
box-sizing: border-box;
}
#forbusiness #sec_02 .online{
width:100%;
background:url(../Image/whole-sale/forbusi_05.jpg)no-repeat;
text-align: center;
color: #fff;
font-weight: bold;
margin-bottom: 30px;
box-sizing: border-box;
}
#forbusiness #sec_02 .online a{
padding: 10px;
width: 100%;
height: 100%;
box-sizing: border-box;
color: #fff;
}
#forbusiness #sec_02 .online p{
width: 100%;
}
#forbusiness p.ttl_06{
width: 100%;
font-size: 18px;
border-bottom: 1px solid #fff;
padding-bottom: 10px;
margin-bottom: 10px;
color: #fff;
}
#forbusiness .link_btn{
float: left;
background: #b52124;
margin-bottom: 60px;
text-align: center;
width: 49%;
margin-right: 2%;
min-height: 123px;
box-sizing: border-box;
}
#forbusiness .link_btn a{
padding: 10px ;
}
#forbusiness .link_btn p{
color: #fff;
}
.tel_btn{
float: left;
width: 49%;
margin-right: 0;
padding: 30px;
box-sizing: border-box;
font-size: 16px;
border: 1px solid;
font-weight: 700;
height: 123px;
text-align: -webkit-center;
}
/*** section03 **/
#forbusiness #sec_03 .ttl05_box{
margin-bottom: 30px;
}
#forbusiness #sec_03 .ttl_05 {
width: 40%;
float: left;
text-align: center;
border-right: 6px solid #000;
margin-right: 10px;
height: 50px;
}
#forbusiness #sec_03 span.eng {
text-align: center;
float: left;
height: 50px;
padding:0;
box-sizing: border-box;
width: 100%;
}
#forbusiness #sec_03 .ttl05_txt{
width: 57%;
float: left;
height: 50px;
padding: 15px 2px;
box-sizing: border-box;
font-weight: bold;
}
#forbusiness #sec_03 .img_box{
width: 40%;
padding: 0 10px;
box-sizing: border-box;
float: left;
text-align: center;
}
#forbusiness #sec_03 .img_box img {
width: 100%;
}
#forbusiness #sec_03 .box {
width: 60%;
box-sizing: border-box;
float: left;
min-height: 290px;
position: relative;
}
#forbusiness #sec_03 hr{
width: 100%;
margin-bottom: 30px;
}
#forbusiness #sec_03 .link{
width: 50%;
float: right;
border: 1px soild#000;
position: absolute;
/* top: 0; */
bottom: 23px;
right: 0;
}
#forbusiness #sec_03 .link a{
padding: 10px;
background: #fff;
color:#000;
border: 1px solid #000;
}
#forbusiness #sec_03 .link a:hover{
background: #000;
color:#fff;
transition: 0.4s;
}
/*************************************************
SITE MAP
************************************************/
#sitemap .sitemap_nav {
width: 100%;
list-style-type: none;
margin: 0 auto;
border: solid 1px #000;
border-top: solid 8px #000;
margin-bottom: 100px;
}
#sitemap h2 {
border-bottom: solid 1px #000;
text-align: center;
font-size: 32px;
line-height: 1;
padding: 50px 0;
}
#sitemap .left {
float: left;
width: 40%;
padding: 30px;
margin-bottom: 10px;
}
#sitemap .center {
float: left;
}
#sitemap .right {
float: left;
width: 40%;
padding: 30px;
}
#sitemap .sitemap_nav li {
padding: 20px;
}
#sitemap .sitemap_nav li a {
display: inline;
margin-bottom: 20px;
text-decoration: none;
color: #000000;
background: url(../Image/common/icon_bean.png)left center no-repeat;
padding: 20px;
padding-left: 35px;
text-align: center;
line-height: 26px;
transition: .3s;
}
#sitemap .sitemap_nav li a:hover {
background-position: 20px!important;
animation-name: rotation;
color: #E53235;
}
#sitemap .float_clear {
clear: both;
}
#sitemap .pager {
text-align: center;
margin-bottom: 35px;
}
/*-------------------------------------
PRIVACY POLICY
--------------------------------------*/
#privacy h1 {
background: url(../Images/common/h1_icon02.png) top center no-repeat;
}
#privacy .sec_inner {
background-color: #fff;
box-sizing: border-box;
padding: 50px 60px;
}
#privacy .sec_inner dl .mgb {
margin-bottom:15px;
}
#privacy .sec_inner dl .mgb02 {
margin-bottom:25px;
}
#privacy .sec_inner dl dt {
color: #000;
font-size: 15px;
font-weight: bold;
background: url(../Image/common/icon_bean.png) left bottom 10px no-repeat;
padding:30px 0 0 18px;
margin-bottom: 10px;
}
#privacy .sec_inner dl dt:first-child {
padding-top:0;
}
#privacy .sec_inner dl dt span {
font-size:18px;
display:inline-block;
margin-right:8px;
}
#privacy .sec_inner dl dd {
border-bottom:dashed 1px #333;
padding-bottom: 30px;
}
#privacy .sec_inner dl dd:last-child {
border-bottom: none;
padding-bottom: 0;
}
#privacy .sec_inner dl dd .number_list {
background-color: #f5f5f5;
padding: 25px;
}
#privacy .sec_inner dl dd .number_list li {
font-size: 14px;
list-style: outside decimal;
padding: 0 0 0.15em 0.5em;
margin: 0 0 0 2em;
}
#privacy .sec_inner dl dd .number_list li:last-child {
padding-bottom:0;
}
#privacy .sec_inner dl dd a {
color: #fff;
font-size: 14px;
background-color: #b52124;
padding: 5px 15px;
margin-left: 15px;
}
#privacy .sec_inner dl dd a:hover {
background-color: #00b6c1;
}
/*=================================================
CONTACT
=================================================*/
/*-------------------------------------
お問い合わせ
--------------------------------------*/
/*mailformproを使用する場合、エラーメッセージなどのエフェクトがうざい場合は以下を使ってください。must-fillはサイト毎に変更必要です。*/
/* フォーム部品のボックスシャドウ打消し */
.mfp_element_text, .mfp_element_number, .mfp_element_select-one, .mfp_element_email, .mfp_element_tel, .mfp_element_textarea {
box-shadow: none;
}
/* 入力エラーのチカチカなし、文字色 */
div.mfp_err {
background: none;
padding-left: 0;
color: #f26;
font-weight: bold;
}
/* エラー箇所のフォーム部品を色つきで強調 */
.problem {
background-color: #fdd;
}
/* 入力OKのエフェクト */
div.mfp_ok {
background-color: #ff7500;
border-color: #ff7500;
font-size: 12px;
}
/* チェックボックスのエフェクト打消し */
form#mailformpro label.mfp_not_checked {
padding: 0;
border: none;
}
form#mailformpro label.mfp_checked {
padding: 0;
border: none;
background: none;
}
/* ボタンのエフェクト打消し */
.mfp_element_submit, .mfp_element_reset, .mfp_element_button {
text-shadow: none;
background: #000;
color: #fff;
padding: 10px 30px;
font-size: 14px;
}
/* 内容確認画面のテーブルを全幅 */
#mfp_confirm_table {
width: 100%;
}
/* 内容確認画面のテーブルのデザイン */
#mfp_confirm_table th, #mfp_confirm_table td {
border: 1px solid #666;
border-top: 1px solid #666 !important;
line-height: 1.5 !important;
}
#mfp_confirm_table th {
padding: 10px 10px !important;
background: #ffd393;
text-align: center !important;
}
#mfp_confirm_table td {
padding: 15px 20px;
}
div#mfp_phase_confirm h4 {
font-size: 0.9em;
margin-bottom: 20px;
}
/* 入力画面の「必須」のデザイン */
.must-fill {
color: rgb(255, 255, 255);
font-size: 0.8em;
margin-right: 10px;
background: rgb(181, 37, 39);
padding: 1px 8px;
border-radius: 4px;
}
#contact .sheet_01 th {
vertical-align: middle;
width: 100%;
text-align: left;
background: url(../Image/common/icon_bean.png) left center no-repeat;
padding-left: 20px;
display: block;
}
#contact .sheet_01 td {
width: 100%;
margin-bottom: 20px;
display: block;
}
#contact input, #contact textarea {
width: 100%!important;
border: solid 1px #CCC;
border-radius: 3px;
padding: 3px 8px;
margin: 2px;
vertical-align: middle;
}
#contact input[name="郵便番号"] {
width: 40%;
}
#contact .width70 {
width: 70%;
}
#contact textarea {
height: 150px!important;
}
#contact td.categoly input{
width: 10px!important;
}
#contact #ftr_btn {
}
/*=================================================
送信完了
=================================================*/
#thanks #sec01 {
text-align: center;
}
#thanks .thx_txt {
padding: 50px;
width: 400px;
border: 3px solid #000;
margin: 0 auto;
}
/*=================================================
ブログなどのページャー（Wordpress）
=================================================*/
/* ナビゲーション全体のデザイン */
.wp-pagenavi {
text-align: center;
}
/* ボタンタグのデザイン */
.wp-pagenavi a {
padding: 0 8px;
background: #3a8ba6;
color: #fff;
margin-right: 4px;
display: inline-block;
}
/* ボタンタグのホバー時のデザイン */
.wp-pagenavi a:hover {
background: #ededed;
color: #333;
}
/* 表示中のページ番号のデザイン */
.wp-pagenavi .current {
background: #ededed;
color: #333;
padding: 0 8px;
margin-right: 4px;
display: inline-block;
}
/* 矢印（ < とか > ）のデザイン */
.wp-pagenavi .nextpostslink, .wp-pagenavi .previouspostslink {
color: #3a8ba6;
background: none;
font-size: 0.9em;
font-weight: bold;
}