@charset "utf-8";
/* @group reset */
*{margin:0;padding:0;font-family:sans-serif,Helvetica;box-sizing: border-box;}
/*
Ul,ol,li{list-style:none;}
*/
img{vertical-align:middle;}
/* end @group reset */

/* 2021.12.26更新
---------------------------------------------------------------------*/
/* 初期設定
----------------------------------------------------------------*/

*{margin:0;padding:0;}
html,body{height:100%;}
body{margin:0px;font-family:'メイリオ','Meiryo',"ＭＳ Ｐゴシック",'Hiragino Kaku Gothic Pro',Osaka,sans-serif;
min-width:320px;word-wrap:break-word;background-color:#fafafa;}
h1,h2,h3,h4,h5,h6,p{margin:0;padding:0;line-height:1.6em;}
main p,main th,main td,main li,main #detail div,main #detail font,main #detail span{color:#333;font-size:15px!important;line-height:1.6em;vertical-align:top;}
main p{text-indent:1em;}
form{margin:0;padding:0;}
select,input{margin:0 5px 0 0;padding:0;}
textarea{resize:none;}
img{margin:0;padding:0;border:0;vertical-align:top;}
ul li,ol li{list-style:none;margin:0;padding:0;}
option{padding-right:1em;}
address{font-style:normal;}

/*メインコンテンツのリンク色*/
a{color:#3366CC;}
/* リンクにマウスオーバーした時の色 */
a:hover{color:#FF9900;}

/* ラッパー
----------------------------------------------------------------*/
.wrapper{max-width:960px;text-align:left;margin:0 auto;padding:0 8px;}

/** ボーダーを追加した際、ボーダーの値を計算で考えなくてよくする方法 **/
*{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;-o-box-sizing:border-box;-ms-box-sizing:border-box;box-sizing:border-box;}

@media screen and (max-width:499px) {
.PC{display:none;}
}
@media screen and (min-width:500px) {
.SP{display:none;}
}

@media screen and (max-width:499px) {
.PC-theme{display:none;}
}
@media screen and (min-width:500px) {
.SP-theme{display:none;}
.PC-theme{padding-top:2px;}
.PC-theme section{margin-bottom:0;}
}


/*--------------------------------
ぱんくず
---------------------------------*/
#breadcrumb,#breadcrumb ul,#breadcrumb li,#breadcrumb h1 {margin:0;padding:0;font-weight:normal;}
#breadcrumb ul li{color:#ccc;font-size:10px;list-style:none;display:inline-block;}
#breadcrumb ul li span,#breadcrumb ul li a{text-decoration:none;color:#999;font-size:11px!important;}
#breadcrumb ul li a:hover{text-decoration:underline;opacity:1;}

/*ページトップへボタン*/
#page-top{position:fixed;z-index:9999;bottom:20px;right:0;font-size:24px;}
#page-top a{text-decoration:none;background:#ccc;color:#fff;text-align:center;display:block;-moz-opacity:0.8;opacity:0.8;padding:10px 14px;cursor:pointer;}
#page-top a:hover{text-decoration:none;color:#ccc!important;opacity:0.85;}

#wrapper {
margin: 0 auto;
overflow:hidden;
}

#side aside {
padding: 0 15px 20px;;
}

/*IEで要素がズレるのを対応*/
.ie7 aside ul li, 
.ie8 aside ul li, 
.ie9 aside ul li {
display: list-item;
padding: 0;
}

#main-contents h1,#main-contents h2,#main-contents h3,#main-contents h4,#main-contents h5,#main-contents h6{font-size:20px;line-height:1.5em;color:#4b4b4b;}
@media screen and (max-width:499px) {
#main-contents h1,#main-contents h2,#main-contents h3,#main-contents h4,#main-contents h5,#main-contents h6{font-size:18px;}
}
.page-title{text-align:center;font-size:20px!important;margin:30px 0 40px;font-weight:bold;}
.page-title span{font-size:13px!important;font-weight:500;}
#main-contents p,#main-contents th,#main-contents td,#main-contents li,#main-contents div{font-size:15px;line-height:2em;font-style:normal;color:#4b4b4b;}
#main-contents p{margin-top:0.6em;}
#main-contents p a{text-decoration:underline;}
@media screen and (max-width:499px) {
#main-contents p,#main-contents th,#main-contents td,#main-contents li,#main-contents div,#main-contents a{font-size:15px;}
}
@media screen and (max-width:499px) {
nav a{color:#4b4b4b!important;font-size:14px;}
}
table{border-spacing:0;border-collapse:inherit;}




/*ヘッダー*/
#top-page #main-contents{margin-top:54px;}
@media screen and (min-width:500px){
#top-page #main-contents{margin-top:0;}
}

@media screen and (max-width:499px){
#SP-Gnav{z-index:10;}

/* グローバルナビゲーション*/
#g-nav img{width:192px;height:auto;margin:0;padding:0;float:left;}
nav li{display:inline;border:none;margin:0;padding:0;line-height:24px;width:90%;}
nav li a{text-decoration:none;}
nav li ul li{display:inherit;margin-left:2em;/*text-indent:2em;*/}
nav .container-flex .item{}
}
/*
@media screen and (max-width:499px){
nav .menu__mega a{color:#fff!important;}
}
*/

#g-nav{width:100%;max-width:960px;}
}
@media screen and (min-width:500px){
header table{border:none;}
#header_wrap header table tbody th{/*border-left:1px solid #999;*/}
#header_wrap header table tbody th a{padding:10px 10px;display:block;margin:0;font-weight:bold;font-size:16px;border-left:1px solid #b9b9b9;color:#4b4b4b;
background: rgb(234,234,234);
background: -moz-linear-gradient(top,  rgb(234,234,234) 0%, rgb(255,255,255) 50%, rgb(242,242,242) 51%, rgb(221,221,221) 100%);
background: -webkit-linear-gradient(top,  rgb(234,234,234) 0%,rgb(255,255,255) 50%,rgb(242,242,242) 51%,rgb(221,221,221) 100%);
background: linear-gradient(to bottom,  rgb(234,234,234) 0%,rgb(255,255,255) 50%,rgb(242,242,242) 51%,rgb(221,221,221) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eaeaea', endColorstr='#dddddd',GradientType=0 );
}
#header_wrap header table tbody th a:hover{}
}

/* ハンバーガーメニューはここから */
.drawer{margin-top:-12px;}
@media screen and (max-width:959px){
.slidemenu-header{display:flex;justify-content:space-between;
background: rgb(74,74,74);
background: -moz-linear-gradient(top,  rgb(74,74,74) 0%, rgb(32,32,32) 100%);
background: -webkit-linear-gradient(top,  rgb(74,74,74) 0%,rgb(32,32,32) 100%);
background: linear-gradient(to bottom,  rgb(74,74,74) 0%,rgb(32,32,32) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4a4a4a', endColorstr='#202020',GradientType=0 );
position:fixed;width:100%;top:0;z-index:90;}
.header-logo{font-size:24px;}
.drawer-item1{margin:6px 0 0 14px;}
.drawer-item2{margin:6px 0 0 22px;}

/*------------------------------
ここから下がハンバーガーメニュー
に関するCSS
------------------------------*/

/* チェックボックスは非表示に */
.drawer-hidden{display:none;}

/* ハンバーガーアイコンの設置スペース */
.drawer-open{height:34px;width:34px;justify-content:center;align-items:center;z-index:100;/* 重なり順を一番上に */
cursor: pointer;}

/* ハンバーガーメニューのアイコン */
.drawer-open span,.drawer-open span:before,
.drawer-open span:after{content:'';display:block;height:2px;width:22px;border-radius:3px;background:#999;transition:0.5s;position:absolute;}

/* 三本線のうち一番上の棒の位置調整 */
.drawer-open span:before{bottom:6px;}

/* 三本線のうち一番下の棒の位置調整 */
.drawer-open span:after{top:6px;}

/* アイコンがクリックされたら真ん中の線を透明にする */
#drawer-check:checked ~ .drawer-open span{background:rgba(255, 255, 255, 0);}

/* アイコンがクリックされたらアイコンが×印になように上下の線を回転 */
#drawer-check:checked ~ .drawer-open span::before{bottom:0;transform: rotate(45deg);}

#drawer-check:checked ~ .drawer-open span::after{top:0;transform:rotate(-45deg);}

/* メニューのデザイン*/
.drawer-content{width:100%;height:100%;position:fixed;top:0;left:100%;/* メニューを画面の外に飛ばす */
z-index:99;background:#fff;transition:.2s;}

/* アイコンがクリックされたらメニューを表示 */
#drawer-check:checked ~ .drawer-content {
left:14%;/* メニューを画面に入れる（デフォルトは「left: 0;」） */}
ul.drawer-list1,ul.drawer-list2{display:grid;padding:7px 20px;width:96%;}
ul.drawer-list1 li{border-top:1px solid #ddd;margin-top:6px;padding-top:6px;list-style:square;}
ul.drawer-list1 li ul li{border:none;margin-top:0;padding-top:0;}
li.drawer-item1,li.drawer-item2{}
.drawer-item1 li ul li{margin-left:14px;list-style:disc;}
}
/* ハンバーガーメニューはここまで */

/* ヘッダー
----------------------------------------------------------------*/
header{background-color:#fff;}
#header{width:auto;margin:0 auto;}
@media screen and (max-width:499px) {
header{height:38px;padding:4px 8px;}
#header-section{}
}
@media screen and (max-width:499px) {
}
#area_header-logo{/*display:inline-block;*/}
@media screen and (max-width:959px) {
#area_header-logo{width:auto;}
}
@media screen and (max-width:499px) {
/*
#area_header-logo{margin-top:2px;}
*/
}
#area_header-info{/*width:70%;*/float:right;margin:6px 0;}

h1#site-logo{}
h1#site-logo img{margin:10px 0;}
@media screen and (max-width:499px) {
h1#site-logo{height:auto;max-width:145px;line-height:1em;}
h1#site-logo img{vertical-align:middle;}
}
#header h1{/*margin-bottom:10px;*/}
@media screen and (max-width:499px) {
#header h1{margin:0 auto;}
}
#header h1 a{color:#fff;}
#header h1 a:hover{color:#fff;}
}@media screen and (min-width:500px) {
#header .flo-r{width:455px;margin:45px 0 0 0;text-align:right;}
#header .flo-r p{float: left;}
}
#header .flo-r{display:none;}
#header_lang{margin-bottom:5px;}
#header_lang ul li{width:25%;text-align:center;background-color:#ddd;float:left;}
#header_lang ul li a{padding:4px 0px;display:block;color:#fff;border-right:1px solid #2c5d14;background:#3f7325;}
#header_lang ul li a:hover{opacity:0.8;}
.border4px{border-bottom:4px solid #000;}

/* ページ別の設定 */
/* 通販システム開発ページ */
#partner-service img{max-width:160px;vertical-align:middle;margin:0 auto;}
@media screen and (max-width:499px){
#partner-service img{max-width:120px;}
}

@media screen and (min-width:500px){
header #SP-Gnav{display:none;}
}
.text-strong{font-weight:bold;}
.option-mark{font-size:0.8em;color:#f667bd;font-weight:100;border:solid 2px #f667bd;padding:2px;width:80px;text-align:center;line-height:1em;border-radius:6px;margin-right:6px;}
.list1 li{margin-left:1.5em;font-size:15px;color:#666;margin:12px 0;list-style-position:outside;}
.list2 li{margin-left:1.2em;list-style-type:disc;list-style:inside;list-style-position:outside;}
.list3 li{list-style-type:none;list-style:inside;display:inline;}
article section{/*margin-bottom:2em;*/}

nav{/*display:inline-block;width:100%;*/}
.descr{font-size:10px;color:#fff;margin-top:-8px;}
@media screen and (max-width:499px){
.descr{font-size:10px;color:#fff;margin:0;line-height:1.2em;}
}

#header-container1{width:100%;
background: rgb(86,86,86);
background: -moz-linear-gradient(top,  rgb(86,86,86) 0%, rgb(53,53,53) 100%);
background: -webkit-linear-gradient(top,  rgb(86,86,86) 0%,rgb(53,53,53) 100%);
background: linear-gradient(to bottom,  rgb(86,86,86) 0%,rgb(53,53,53) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#565656', endColorstr='#353535',GradientType=0 );
}
#header-container2{width:100%;border-top:3px solid #6c8dd1;
background: rgb(32,32,32);
background: -moz-linear-gradient(top,  rgb(32,32,32) 0%, rgb(86,86,86) 100%);
background: -webkit-linear-gradient(top,  rgb(32,32,32) 0%,rgb(86,86,86) 100%);
background: linear-gradient(to bottom,  rgb(32,32,32) 0%,rgb(86,86,86) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#202020', endColorstr='#565656',GradientType=0 );
}
#PC-header,#g-nav,main,footer,.main,.container{width:100%;max-width:960px;margin:0 auto;}
#PC-header p{margin:0;padding:0;}
#header_wrap header ul{list-style:none;}

/* PC用のメガドロップメニュー */

.contents__inner{box-sizing:border-box;}
.menu{position:relative;width:100%;height:50px;max-width:1060px;margin:0 auto;}

.menu > li {
display:inline-block;
/*
    float:left;
    width: 25%;*/ /* グローバルナビ4つの場合 */
/*
    height: 35px;
    line-height: 35px;
    background:#000;
*/
    padding:15px 2.5%;
}

.menu > li a {
/*
    display: block;
*/
    color: #000;
    font-size:17px;
    line-height:26px;
	text-decoration:none;
}

.menu > li a:hover {
	text-decoration:underline;
}

ul.menu__second-level {
    visibility: hidden;
    opacity: 0;
    z-index: 1;
}

ul.menu__third-level {
    visibility: hidden;
    opacity: 0;
}

ul.menu__fourth-level {
    visibility: hidden;
    opacity: 0;
}

.menu > li:hover {
    background: #fff;
    -webkit-transition: all .5s;
    transition: all .5s;
}

.menu__second-level li {
    border-top: 1px solid #111;
}

.menu__third-level li {
    border-top: 1px solid #111;
}

.menu__second-level li a:hover {
    background: #111;
}

.menu__third-level li a:hover {
    background: #000;
}

.menu__fourth-level li a:hover {
    background: #000;
}

/* 下矢印 */
.init-bottom:after {
    content: '';
    display: inline-block;
    width: 6px;
    height: 6px;
    margin: 0 0 0 10px;
    border-right: 1px solid #fff;
    border-bottom: 1px solid #fff;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

/* floatクリア */
.menu:before,
.menu:after {
    content: " ";
    display: table;
}

.menu:after {
    clear: both;
}

.menu {
    *zoom: 1;
}
/* 1列目 */
li.menu__mega ul.menu__second-level {
    position: absolute;
    top: 40px;
    left: 0;
    box-sizing: border-box;
    width: 100%;
    padding: 20px 2%;
    background:rgb(255 255 255 / 90%);
    -webkit-transition: all .2s ease;
    transition: all .2s ease;
    z-index:100;
}

li.menu__mega:hover ul.menu__second-level {
    top: 50px;
    visibility: visible;
    opacity: 1;
}

@media screen and (min-width:500px){
/* 3列表示にしたい時の設定はここから */
li.menu__mega ul.menu__second-level > li {
    float: left;
/*    width: 24%;*//* 3列表示を変更したい時にいじる */
    border: none;
    z-index:100;
    margin:5px 15px;
}

li.menu__mega ul.menu__second-level > li:nth-child(4n+3) {
/*
    margin: 0 2%;*//* 3列表示を変更したい時にいじる */
    z-index:100;
}
/* 3列表示にしたい時の設定はここまで */
}
@media screen and (max-width:499px){
/* 2列表示にしたい時の設定はここから */
li.menu__mega ul.menu__second-level > li {
    float: left;
    width: 49%;
    border: none;
}

li.menu__mega ul.menu__second-level > li:nth-child(2n+1) {
    margin: 0 2% 0 0;
}
/* 2列表示にしたい時の設定はここまで */
}
#btn_header-mail.btn01{text-align:right;padding:0;margin-top:-2px;}
.btn01#btn_header-mail a{margin:0;padding:10px 12px;}
#btn_header-tell{text-align:left;margin-top:3px;margin-right:10px;}
#btn_header-tell #header-tel a{font-size:20px;font-weight:bold;text-decoration:none;color:#fff;}
#btn_header-tell p{color:#fff;font-size:12px;}

#top-slider{border:1px solid #ddd;margin-top:6px;}
.ad{padding:0!important;}

div#side-office ul{clear:both;margin-bottom:20px;}
div#side-office ul li strong{margin-top:40px;}

.clear{clear: both;}
.center,text-C{text-align:center;text-indent:0;}

/* メインコンテンツ */
/*↓サイドメニューが長くなった場合のレイアウト指示↓
main#main-contents{width:70%;float:left;}
aside#side-contets{width:28%;float:right;}
@media screen and (max-width:499px){
main#main-contents{width:100%;float:none;}
aside#side-contets{width:100%;float:none;}
}
*/

/* 文章のカラム */
.text-column{column-gap:60px;column-count:2;column-rule-style:dotted;column-rule-width:1px;column-rule-color:#444;margin-bottom:40px;}

/* リスト */
ul.list01 li{list-style:disc!important;}
ol li{list-style-type:auto!important;}
.list01 li{list-style-position:outside;margin-left:1.5em;}
.list02 li{list-style-position:outside;margin-left:1.5em;display:inline-flex;}


.swiper-container{z-index:1;}

/* ボタン */
.btn-contact{margin-left:10px;
background: rgb(68,114,212);
background: -moz-linear-gradient(top,  rgb(68,114,212) 0%, rgb(50,93,184) 100%);
background: -webkit-linear-gradient(top,  rgb(68,114,212) 0%,rgb(50,93,184) 100%);
background: linear-gradient(to bottom,  rgb(68,114,212) 0%,rgb(50,93,184) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4472d4', endColorstr='#325db8',GradientType=0 );
}
.btn-contact a{color:#fff;font-size:13px;font-weight:bold;padding:10px 14px;display:block;}

.area_column{padding:24px;border:solid 2px #dfdfdf;margin-top:20px;border-radius:8px;}
.area_column .btn01{margin:0;}

/*フッター*/
#footer_wrap{width:100%;background:#222;}
#goto-top{background-color:#222;font-size:0.85em;border-radius:4px 4px 0 0;margin-top:20px;}
#goto-top a{color:#fff;padding:6px 14px 0;text-decoration:none;display:block;}
#goto-top a:hover{text-decoration:underline;}
footer ul, footer ol{}
@media screen and (max-width:499px){
footer ul, footer ol{}
}
footer #payments li,footer #social li{display:inline-block;}
footer #payments li img{height:18px;}
footer #social{float:right;}
footer #social ul{text-align:right;}
@media screen and (max-width:499px) {
footer #social{float:auto;text-align:center;}
footer #social ul{text-align:center;}
}
footer #social li img{height:22px;}
@media screen and (max-width:499px) {
footer #payments li img{height:15px;}
footer #social li img{height:16px;}
}

footer address{font-style:normal;}
@media screen and (max-width:499px) {
#footer_wrap{padding:10px;}
}
footer{padding:20px 6px 2px;}
footer aside.social{}
footer h1,footer h2,footer h3,footer h4,footer h5,footer h6{font-weight:bold;}
footer p,footer a,footer li,footer p,footer th,footer td,footer h1,footer h2,footer h3,footer h4,footer h5,footer h6{line-height:20px;font-size:12px;}
@media screen and (max-width:499px) {
footer p,footer a,footer ul.list01 li a,footer ul.list01 li{font-size:14px;line-height:2em;}
}
footer *{color:#ebeef5!important;}
@media screen and (max-width:499px) {
footer h2{border-bottom:1px solid #ddd;margin-bottom:6px;}
}
footer ul.other-link li{display:inline;margin-right:20px;}
#footer_01 img{padding-left:3px;padding-top:5px;}
#footer_01 img:hover{opacity:0.8;}
#footer_02{/*width:690px;*/}
#footer_02 .company-name{font-size:19px;}
#footer_02 .tel-number{font-size:26px;font-family:Helvetica;font-weight:bolder;line-height:25px;}

footer #office ul li{font-size:13px;}
@media screen and (min-width:500px) {
footer #office{margin-right:60px;}
}
footer #f-info{width:94%;max-width:960px;margin:0 auto;padding:2px 0;}
@media screen and (max-width:499px) {
footer #f-info{padding:10px 0;}
}
footer a{text-decoration:underline;}
footer a:hover{text-decoration:none;}
footer section ul li{text-align:left;}
footer address{font-style:normal;padding-left:10px;}
.footer-border{clear:both;border-bottom:1px solid #666;margin:20px 0;}

/* コピーライト*/
footer #fcopy{padding:6px;}
/* ページトップ*/
#fup{text-align:right;margin:20px 10px;}
#fup a{color:#a25900;text-decoration:none;}
footer #fup a:hover{color:#bd7121;text-decoration:none;}


/* スマートフォン対応 */
@media screen and (max-width:499px) {
.PC{display:none;}

/*共通の指示*/
/*テキスト等*/

/*画像の指示*/
.margin-img15-L{margin:0 15px 15px 0;float:left;}
.margin-img15-R{margin:0 0 15px 15px;float:right;}
.btn_outsidemark{padding-left:7px;opacity:0.4;width:11px;vertical-align:inherit;}


/*メインコンテンツ*/
#contents{width:100%;}
.page-mv{width:100%;margin-bottom:10px;}
.page-mv img{max-width:100%;}
.textandnophoto{width:440px;margin-right:60px;float:left;}
.textblock_w50{width:440px;}

.area_column{padding:20px;border:solid 1px #ccc;margin-top:20px;border-radius:8px;}
.area_column .title04{margin-top:0;}
.textandnophoto{width:100%;margin-bottom:20px;}

/*トップページ*/
.page-home_mv{width:100%;margin-bottom:0;}
img.page-home_mv{}
/*
.page-home_textandimg{}
.page-home_textandimg-img{max-width:100%;}
*/

/* ブログ更新のお知らせ部分 */
#page-home_main_infoarea{margin-top:20px;}
#page-home_blogarea{width:100%;border:solid 2px #d0d0d0;border-radius:9px;}
#page-home_blogarea h2{padding:15px;border-bottom:solid 1px #d0d0d0;}
#page-home_blogarea table{}
#page-home_blogarea table td{}

#page-home_outbound-list{width:100%;margin-top:10px;}
#page-home_outbound-list li{float:left;width:50%;overflow-x:hidden;border-right:solid 2px #fff;}
#page-home_outbound-list li:last-child{border-right:none;}
#page-home_outbound-list li img{max-width:100%;}
#page-home_outbound-list img:hover{opacity:0.8;}

/*事例紹介ページ*/
#content-wrapL{width:100%;}
#content-wrapR{clear:both;width:100%;margin-top:20px;}
#content-wrapR h2.title02{text-align:center;font-size:1.05em;border-bottom:solid 1px #4472D3;padding-bottom:3px;margin-top:30px;}

#case-example h2{clear:both;}
.page-case_img{width:100%;margin-bottom:10px;}

/* サイドメニュー */
.page-case_side-nav{text-align:center;font-weight:bolder;}
.page-case_side-nav h2{background-color:#3F6AC4;color:#fff!important;padding:5px;}
.page-case_side-nav ul li{width:50%;border:solid 1px #4472D3;background:#fff;float:left;}
.page-case_side-nav li a{display:block;padding:6px 2px;font-size:13px!important;}
.page-case_side-nav li:hover{background:#f5f7fd;}
.page-case_side-nav li.page-active{
background: #f4f4f4;
background: -moz-linear-gradient(top,  #f4f4f4 0%, #dbdbdb 100%);
background: -webkit-linear-gradient(top,  #f4f4f4 0%,#dbdbdb 100%);
background: linear-gradient(to bottom,  #f4f4f4 0%,#dbdbdb 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f4f4f4', endColorstr='#dbdbdb',GradientType=0 );
}
#content-wrapL .SPnav_lastmax{width:100%;}

.parts_case-example{font-size:0.8em;font-weight:100;background-color:#3F6AC4;padding:4px 10px;color:#fff;margin-bottom:10px;display:block;border-radius:4px;}

/*企業情報（会社概要・プロフィール・採用情報）ページ*/
/*会社概要のテーブル部分*/
.table_page-profile01{table-layout:fixed;width:100%;text-align:left;border-top:solid 1px #d0d0d0;margin-bottom:10px;border-collapse:collapse;}
.table_page-profile01 th{width:95px;}
.table_page-profile01 th,.table_page-profile01 td{border-bottom:solid 1px #d0d0d0;padding:15px 0;line-height:1.5em;}
.g-map{margin-bottom:30px;}

.table_page-profile02{table-layout:fixed;width:100%;text-align:left;border:solid 1px #d0d0d0;margin-bottom:30px;border-collapse:collapse;}
.table_page-profile02 th{width:25%;background-color:#f6f6f6;border-right:solid 1px #d0d0d0;}
.table_page-profile02 th,.table_page-profile02 td{padding:10px;line-height:1.5em;}

/*企業プロフィール・Googleマップと企業の詳細部分*/
.page-profile_officetext{margin-top:20px;}

/*お問い合わせ・コンタクトページ*/
.table_contact-form table, .table_contact-form tbody, .table_contact-form tr, .table_contact-form th, .table_contact-form td {display:block;}

.page-contact_img-contact img{width:100%;margin-top:15px;margin-bottom:20px;}

#area_contact-form{padding:15px;background-color:#F7FAFC;}

.table_contact-form{padding:15px;background-color: #fff;}
.table_contact-form table{width:100%;}

.table_contact-form table{}
.table_contact-form table th,td{}
.table_contact-form table th{text-align:left;margin-top:25px;}
.table_contact-form table td{}

.table_contact-form .form-btn{margin-top:30px;margin-left:220px;}
.table_contact-form .form-btn a{float:left;width:150px;background-color:#b2b2ba;color:#fff;text-align:center;font-size:1em;font-weight:bolder;margin-right:30px;padding:12px 0;}
#area_contact-form .form-btn a:hover{background-color:#3F6AC4;}
.form_sendbtn ul li{display:inline;padding-right:40px;}

/*お問い合わせ・コンタクトページの送信確認ページ*/
.table_contactform-design{width:100%;}
.table_contactform-design  th{}
.table_contactform-design td{}
.table_contactform-design li{padding:30px 20px;}
.red{font-size:0.7em;font-weight:100;color:#fff;margin-left:10px;padding:3px 8px;background-color:red;border-radius:4px;}

#side-nav{float:left;width:220px;
margin-top:30px;border-top:solid 1px #e9e9e9;}
#side-nav a{font-size:0.9em;font-weight:bolder;display:block;width:184px;height:19px;padding:20px 18px;;
background:url(https://mukae.co.jp/test/img/btn_sidenav_off.jpg) no-repeat;}
#side-nav a:hover{
background:url(https://mukae.co.jp/test/img/btn_sidenav_on.jpg) no-repeat;}

/*サイトマップの設定*/
#area-sitemap{margin-left:40px;}
#area-sitemap h2,#area-sitemap p,#area-sitemap a,#area-sitemap li{font-size:1em;line-height:35px;padding-top:20px;}
#area-sitemap ul{border-left:solid 1px #d0d0d0;margin-left:20px;}
#area-sitemap li{font-weight:100;padding-left:30px;}
#area-sitemap a{text-decoration:underline;}

} /* --- @スマートフォン対応 ここまで --- */

/* PC用 */
@media screen and (min-width:500px) {
.SP{display:none;}
body{width:100%;background-color:#fafafa;}

/*メインコンテンツ*/
#contents{width:100%;max-width:960px;margin:0 auto;}
.page-mv{margin-bottom:20px;width:100%;}
.textandnophoto{width:440px;margin-right:60px;float:left;}

/*トップページ*/
.page-home_mv{margin-bottom:35px;}
/*
.page-home_textandimg{float:right;width:510px;}
.page-home_textandimg-img{float:left;width:390px;}
*/
#page-home_main_infoarea{margin-top:20px;max-width:600px;width:65%;}

#page-home_blogarea{width:700px;}
#page-home_blogarea table{margin-top:10px;width:100%;border-bottom:solid 1px #d0d0d0;}
#page-home_blogarea table td{border:none;border-top:solid 1px #d0d0d0;padding:6px 0;}
#page-home_outbound-list{width:210px;float:right;margin-top:37px;}
#page-home_outbound-list img{width:210px;margin-bottom:10px;float:right;}
#page-home_outbound-list img:hover{opacity:0.8;}

/*事例紹介ページ*/
#content-wrapL{width:30%;max-width:220px;float:left;}
#content-wrapR{width:68%;max-width:670px;float:right;}
#case-example h2{clear:both;}
.page-case_img{width:250px;float:left;margin-right:20px;margin-top:10px;}
.page-case_side-nav{font-size:1em;font-weight:bold;border:2px solid #3F6AC4;border-radius:5px 5px 0 0;}
.page-case_side-nav h2{font-size:16px;background-color:#3F6AC4;color:#fff!important;padding:5px 10px;margin:0;}
.page-case_side-nav ul{border-top:solid 1px #e9e9e9;}
.page-case_side-nav li{padding:10px 0;border-bottom:1px solid #efefef;
background: rgb(255,255,255);
background: -moz-linear-gradient(top,  rgb(255,255,255) 0%, rgb(246,246,246) 92%, rgb(255,255,255) 100%);
background: -webkit-linear-gradient(top,  rgb(255,255,255) 0%,rgb(246,246,246) 92%,rgb(255,255,255) 100%);
background: linear-gradient(to bottom,  rgb(255,255,255) 0%,rgb(246,246,246) 92%,rgb(255,255,255) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ffffff',GradientType=0 );
}
.page-case_side-nav li a{display:block;padding:10px;color:#4b4b4b;border-left:6px solid #d3d3d3;}
.page-case_side-nav li a:hover{border-left:6px solid #4473d3;}
.page-case_side-nav li.page-active a{border-left:6px solid #4473d3;}

.parts_case-example{font-size:0.8em;font-weight:100;background-color:#3F6AC4;padding:6px 10px;color:#fff;border-radius:4px;margin-right:10px;clear:both;}

/*企業情報（会社概要・プロフィール・採用情報）ページ*/
/*会社概要のテーブル部分*/
.table_page-profile01{table-layout:fixed;width:100%;text-align:left;border-top:solid 1px #d0d0d0;margin-bottom:60px;border-collapse:collapse;}
.table_page-profile01 th{font-weight:bolder;}
.table_page-profile01 th,.table_page-profile01 td{border-bottom:solid 1px #d0d0d0;padding:15px 0;line-height:1.5em;}

.table_page-profile02{table-layout:fixed;width:100%;text-align:left;border:solid 1px #d0d0d0;margin-bottom:60px;border-collapse:collapse;}
.table_page-profile02 th{width:25%;font-weight:500;background-color:#f6f6f6;border-right:solid 1px #d0d0d0;}
.table_page-profile02 th,.table_page-profile02 td{padding:15px 20px;line-height:1.75em;}
.g-map{width:298px;}

/*企業プロフィール・Googleマップと企業の詳細部分*/
.page-profile_officetext{margin-bottom:20px;}
.page-profile_officetext h4{margin-bottom:5px;}
.page-profile_officetext p{line-height:1.5em;}


/*お問い合わせ・コンタクトページ*/
.contact-textblock{}
.page-contact_img-contact img{margin-top:20px;}

#area_contact-form{padding:60px 85px;background-color:#fff;}
#area_contact-form table{border-bottom:solid 1px #d0d0d0;width:100%;}
.table_contact-form{background-color: #fff;}
#area_contact-form table th,td{border-top:solid 1px #d0d0d0;padding:5px;}
#area_contact-form table th{width:35%;text-align:left;}
#area_contact-form table td{width:65%;}
#area_contact-form .form-btn{margin-top:30px;margin-left:220px;}
#area_contact-form .form-btn a{float:left;width:150px;background-color:#b2b2ba;color:#fff;text-align:center;font-size:1em;font-weight:bolder;margin-right:30px;padding:12px 0;}
#area_contact-form .form-btn a:hover{background-color:#3F6AC4;}
/*お問い合わせ・コンタクトページの送信確認ページ*/
.table_contactform-design{width:100%;min-height:450px;}
.table_contactform-design  th{width:30%;}
.table_contactform-design td{width:70%;border-bottom:none;}
.table_contactform-design li{padding:40px;}
.red-icon{font-size:0.7em;font-weight:100;color:#fff;margin-left:10px;padding:3px 8px;background-color:red;border-radius:4px;}

#side-nav{float:left;width:220px;margin-top:30px;border-top:solid 1px #e9e9e9;}
#side-nav a{font-size:0.9em;font-weight:bolder;display:block;width:184px;height:19px;padding:20px 18px;color:#4b4b4b;background:url(https://mukae.co.jp/test/img/btn_sidenav_off.jpg) no-repeat;}
#side-nav a:hover{background:url(https://mukae.co.jp/test/img/btn_sidenav_on.jpg) no-repeat;}

/*サイトマップの設定*/
#area-sitemap{margin-left:40px;}
#area-sitemap h2,#area-sitemap p,#area-sitemap a,#area-sitemap li{font-size:1em;line-height:35px;padding-top:20px;}
#area-sitemap ul{border-left:solid 1px #d0d0d0;margin-left:20px;}
#area-sitemap li{font-weight:100;padding-left:30px;}
#area-sitemap a{text-decoration:underline;}
}


/*メイン
----------------------------------------------------------------*/
#pagebody{/*max-width:960px;*/margin-top:10px;}
@media screen and (max-width:499px) {
#pagebody{max-width:none;}
}
#pagebody img{width:100%;}
@media screen and (max-width:499px) {
#spec_table{width:100%;}
}
table{width:100%;border-collapse:collapse;}
table.table01 th,table.table01 td{border:1px solid #ccc;vertical-align:middle;padding:4px;}


/*横ナビ
----------------------------------------------------------------*/
#hnavigation{width:750px;margin:0 auto;padding:0;}
#hnavigation li{width:auto;float:left;}
#hnavigation li img{margin:0;padding:0;}

/*左枠
----------------------------------------------------------------*/
#leftside{max-width:220px;width:22%;float:left;padding:0;}
#leftside #vnavigation img{width:auto;}
@media screen and (max-width:499px) {
#leftside {width:96%;float:none;max-width:none;margin:10px auto;}
}

/*縦ナビ
----------------------------------------------------------------*/
#vnavigation{margin:0;padding:0;}
ul#vnavigation{list-style-image:url('../images/topp_arw.gif');}
#vnavigation li{padding:0;}
#vnavigation li a{display:block;padding:12px 10px;color:#333;border:1px solid #ccc;font-size:15px;font-weight:bold;
background: #ffffff;
background: -moz-linear-gradient(top,  #ffffff 0%, #f5f5f5 49%, #e9e9e9 51%, #f6f6f6 100%);
background: -webkit-linear-gradient(top,  #ffffff 0%,#f5f5f5 49%,#e9e9e9 51%,#f6f6f6 100%);
background: linear-gradient(to bottom,  #ffffff 0%,#f5f5f5 49%,#e9e9e9 51%,#f6f6f6 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f6f6f6',GradientType=0 );
}
#vnavigation li a:hover{color:#ff8c00;}
#vnavigation li a.active{color:#ff8c00;}
#vnavigation li a.first{border-radius:6px 6px 0 0;}
#vnavigation li a.last{border-radius:0 0 6px 6px;}
#vnavigation li img{margin:0;padding:0;}

@media screen and (max-width:499px) {
#vnavigation{display:none;}
}

/*右枠
----------------------------------------------------------------*/
#rightside{width:73%;float:right;}
@media screen and (max-width:499px) {
#rightside{width:96%;max-width:none;float:none;margin:10px auto;}
}
#side-products{margin-top:40px;}
@media screen and (max-width:499px) {
#side-products{margin:10px 0;}
#side-products li{margin-left:2%;width:47%;float:left;}
#side-products li img{width:100%;}
}
#rightside h1.pagetitle{font-size:28px;}
@media screen and (max-width:499px) {
#rightside h1.pagetitle{font-size:18px;}
}

/*下ナビ
----------------------------------------------------------------*/
#fnavigation{width:auto;background-color:#226820;margin:20px 0 0 0;}
#fnavigation p{color:#e7a67a;text-align:center;line-height:20px;padding:6px 2px 5px 2px;font-size: 11px;}
#fnavigation a{color:#f1f1f1;text-decoration:underline;}
#fnavigation a:hover{color:#E6FCFF;text-decoration:underline;}
#info{background:#ddd;}


/*トップページ #topp
----------------------------------------------------------------*/
#topp{width:100%;padding:0;}
#topp h2{padding:0;}
.sidebnr{ margin:20px 0 0 0;}

/*概要ページ
----------------------------------------------------------------*/
table#table_page-about th{vertical-align:baseline;}




/*全ページ共通のCSS*/
.clear-both	{clear:both;}
#main .float-L img,#main .float-R img{border:solid 1px #d0d0d0;}
img.border-none{border:none!important;}
article{margin-bottom:40px;}
table th,table td{vertical-align:middle;}

.font01{font-size:15px!important;}
.font02{font-size:20px!important;}
.font03{font-size:24px!important;}
.font04{}
.font05{}
.font06{}
.txt-gray{color:#ebeef5!important;}

.pdg5{padding:5px;}
.pdg10{padding:10px;}

.pdgt40{padding-top:40px;}
.pdgb0{padding-bottom:0!important;}

/*空間調整・アキ調整*/
.mt0{margin-top:0!important;}
.mt5{margin-top:5px!important;}
.mt10{margin-top:10px!important;}
.mt20{margin-top:20px!important;}
.mt30{margin-top:30px!important;}
.mt40{margin-top:40px!important;}
.mt50{margin-top:50px!important;}
.mt60{margin-top:60px!important;}
.mt70{margin-top:70px!important;}
.mt80{margin-top:80px!important;}
.mt90{margin-top:90px!important;}
.mt100{margin-top:100px!important;}

.mb0{margin-bottom:0!important;}
.mb10{margin-bottom:10px!important;}
.mb20{margin-bottom:20px!important;}
.mb30{margin-bottom:30px!important;}
.mb40{margin-bottom:40px!important;}
.mb50{margin-bottom:50px!important;}
.mb60{margin-bottom:60px!important;}
.mb70{margin-bottom:70px!important;}
.mb80{margin-bottom:80px!important;}
.mb90{margin-bottom:90px!important;}
.mb100{margin-bottom:100px!important;}

.ml0{margin-left:0!important;}
.ml10{margin-left:10px!important;}
.ml20{margin-left:20px!important;}
.ml30{margin-left:30px!important;}
.ml40{margin-left:40px!important;}
.ml50{margin-left:50px!important;}
.ml60{margin-left:60px!important;}
.ml70{margin-left:70px!important;}
.ml80{margin-left:80px!important;}
.ml90{margin-left:90px!important;}
.ml100{margin-left:100px!important;}

.mr0{margin-right:0!important;}
.mr5{margin-right:5px!important;}
.mr10{margin-right:10px!important;}
.mr20{margin-right:20px!important;}
.mr30{margin-right:30px!important;}
.mr40{margin-right:40px!important;}
.mr50{margin-right:50px!important;}
.mr60{margin-right:60px!important;}
.mr70{margin-right:70px!important;}
.mr80{margin-right:80px!important;}
.mr90{margin-right:90px!important;}
.mr100{margin-right:100px!important;}

.pdg0{padding:0!important;}
.pdg5{padding:5px;}
.pdg10{padding:10px;}
.pdg15{padding:15px;}
.pdg20{padding:20px;}
.pdg25{padding:25px;}
.pdg30{padding:30px;}
.pdg40{padding:40px;}
.pdg50{padding:50px;}

.pdgt0{padding-top:0!important;}
.pdgt10{padding-top:10px;}
.pdgt20{padding-top:20px;}
.pdgt30{padding-top:30px;}
.pdgt40{padding-top:40px;}
.pdgt50{padding-top:50px;}
.pdgt60{padding-top:60px;}
.pdgt70{padding-top:70px;}
.pdgt80{padding-top:80px;}
.pdgt90{padding-top:90px;}
.pdgt100{padding-top:100px;}

.pdgb0{padding-bottom:0!important;}
.pdgb10{padding-bottom:10px;}
.pdgb20{padding-bottom:20px;}
.pdgb30{padding-bottom:30px;}
.pdgb40{padding-bottom:40px;}
.pdgb50{padding-bottom:50px;}
.pdgb60{padding-bottom:60px;}
.pdgb70{padding-bottom:70px;}
.pdgb80{padding-bottom:80px;}
.pdgb90{padding-bottom:90px;}
.pdgb100{padding-bottom:100px;}

/* 空間調整 */
.w10{width:9%;margin:0 0.5%;}
.w20{width:19%;margin:0 0.5%;}
.w25{width:23%;margin:0 1%;}
.w30{width:28%;margin:0 1%;}
.w33{width:31%;margin:0 2%;}
.w40{width:38%;margin:0 1%;}
.w50{width:46%;margin:0 2%;}
.w60{width:58%;margin:0 1%;}
.w70{width:68%;margin:0 1%;}
.w80{width:78%;margin:0 1%;}
.w90{width:88%;margin:0 1%;}
.w100{width:100%;}

.w10PC{width:9%;margin:0 0.5%;}
.w20PC,.w20PC2,.w20PC3{width:19%;margin:0 0.5%;}
.w25PC,.w25PC2,.w25PC3{width:23%;margin:0 1%;}
.w30PC,.w30PC2{width:28%;margin:0 1%;}
.w33PC,.w33PC2{width:31%;margin:0 1%;}
.w30PC-mr{margin-right:3.5%;}
.w40PC{width:38%;margin:0 1%;}
.w50PC{width:46%;margin:0 2%;}
.w60PC{width:58%;margin:0 1%;}
.w70PC{width:68%;margin:0 1%;}
.w80PC{width:78%;margin:0 1%;}
.w90PC{width:88%;margin:0 1%;}

@media screen and (max-width:499px){
.w20PC,.w25PC,.w30PC,.w33PC,.w40PC,.w50PC,.w60PC,.w70PC,.w80PC,.w90PC{width:100%;margin:0;}
.w25PC2,.w30PC2,.w33PC2{width:46%;margin:0 2%;}
.w20PC3,.w25PC3{width:31%;margin:0 1%;}
.w30PC-mr{margin-right:0;}
}

/* レイアウト */
.float-L{float:left;}
.float-R{float:right;}

.three-column{width:100%;overflow:hidden;margin:0;padding:0;}
.three-column .w30 .title03{margin-top:30px;padding:0.75em 1em;}


/*両端への均等配置 参考：mana基礎編P154*/
.container-between{display:flex;justify-content:space-between;}
@media screen and (max-width:499px) {
.container-between{display:inline;}
}
.container-between .item{margin:8px;}

/*下へ順次、追加していく配置 参考：mana基礎編P154*/
.flex-wrap{display:flex;flex-wrap:wrap;}
.flex-wrap ul li{margin-right:40px;}

/*複数行に渡り、均等配置 mana基礎編P155*/
.container-flex{display:flex;flex-wrap:wrap;align-content:space-around;}
/*
.container-flex .item{margin:8px;}
*/


/* テキストの装飾 */
.text-R,.right{text-align:right;}
.center,.text-C{text-align:center;}
.left{text-align:left;}
p.right,p.center,p.left{padding-bottom:0!important;}
.bold{font-weight:bold;}
.big{font-size:1.3em;line-height:2em;}
ul.kome li:before{content:'※ ';margin-left:-14px;}
a.underline{text-decoration:underline!important;}
a.underline:hover{text-decoration:none!important;}
.mini{font-size:78%!important;text-indent:0;}
.ti0{text-indent:0!important;}

/* 枠組み（エリア）の装飾 */
.area01{border:2px solid #999;border-radius:8px;padding:13px 18px;margin:20px auto;}


/*文字サイズ、装飾
----------------------------------------------------------------*/

.title01{font-size:1.15em;font-weight:bold;line-height:1.5em;margin-top:30px;margin-bottom:5px;}
.title02{font-size:1.15em;font-weight:bold;line-height:1.5em;margin-top:30px;margin-bottom:5px;padding-left:10px;border-left:solid 6px #b7b7b7;}
.title03{font-size:1.1em;font-weight:bold;line-height:1.35em;margin-top:40px;border-bottom:solid 1px #b7b7b7;margin-bottom:20px;padding-bottom:3px;}
.title04{margin-top:40px;margin-bottom:10px;font-size:1.1em;line-height:1.5em;}
.title04 img{margin-right:15px;width:18px;height:18px;}
#page-home_blogarea .title04{margin-top:0;}
.title05{font-size:1.25em;line-height:1.5em;font-weight:bold;margin-top:10px;}
.title05 img{margin-right:5px;width:26px;}

.area01 .title01,.area01 .title02,.area01 .title03,.area01 .title04,.area01 .title05{margin-top:0;}
@media screen and (min-width:500px) {
.title01{line-height:1.75em;margin-bottom:8px;}
.title02{margin-top:20px;padding-left:15px;border-left:solid 6px #b7b7b7;}
.title03{margin-top:20px;border-bottom:solid 2px #b7b7b7;margin-bottom:20px;padding-bottom:3px;}
.title04{}
.title04 img{margin-right:15px;width:18px;height:18px;}
.title05{width:100%;line-height:1.6em;margin-top:15px;margin-bottom:40px;text-align:left;}
.title05 img{margin-right:15px;width:26px;}
.a_tellnumber{color:#4b4b4b;}
}
.title05{
color:#fff;padding:10px 8px 6px!important;font-size:16px;border-bottom:4px solid #9e7024;margin-bottom:10px;border-radius:4px 4px 0 0;
background: #997960;
background: -moz-linear-gradient(top,  #997960 0%, #62300a 20%);
background: -webkit-linear-gradient(top,  #997960 0%,#62300a 20%);
background: linear-gradient(to bottom,  #997960 0%,#62300a 20%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#997960', endColorstr='#62300a',GradientType=0 );
}

.txt11{	font-size:11px;	}
.txt12{	font-size:12px;	}
.txt13{	font-size:13px;	}
.txt14{	font-size:14px;	}
.txt15{	font-size:15px;	}

.bold{	font-weight:bold;	}
.cap{font-size:11px;line-height:15px;font-weight:100;}
.red{color:#FF0000;}
.orange{color:#FF6600;}
.blue{color:#003399;}
.green{color:#5b9000;}
.brown{color:#663333;}
.pink{color:#FF33CC;}
.gray{color:#666666;}

h1,h2,h3,h4,h5,h6{font-weight:500;}

.btn01{text-align:center;}
.btn01 a{color:#fff!important;font-size:15px;font-weight:bold;display:block;/*border-radius:4px;*/display:inline-block;text-decoration:none;padding:8px 14px;margin:10px auto;background:#333;border:2px solid #333;}
.btn01 a:hover{color:#333!important;text-decoration:none;background:#fff;border:2px solid #333;}
@media screen and (max-width:499px){
.btn01 a{font-size:14px;text-align:center;}
}
header .btn01 a{color:#333!important;font-size:15px;font-weight:bold;display:block;border-radius:4px;display:inline-block;text-decoration:none;padding:8px 14px;margin:10px auto;background:#fff;}
header .btn01 a:hover{opacity:0.8;}

.btn02{text-align:center;}
.btn02 a{color:#333;text-decoration:none;border-radius:4px;max-width:400px;padding:16px;margin:10px auto;display:block;border:2px solid #333;background:#fff;}
.btn02 a:hover{color:#fff;opacity:0.7;background:#333;}
.btn03{display:inline-block;padding:10px;border-radius:6px;width:80%;box-sizing:border-box;background-color:#39c;color:#fff!important;font-weight:bold;margin-top:10px;text-align:center;text-decoration:none;}
.btn03:hover{background-color:#f60;}
.btn04{width:100%;text-align:center;margin-top:20px;margin:10px auto 0;}
.btn04 a{text-decoration:none;color:#fff;display:block;padding:10px 5px;border:solid 1px #0075D0;border-radius:4px;font-size:18px;background: rgb(52,165,241);}

.btn-form{text-align:center;}
.btn-form a{color:#fff!important;font-size:15px;font-weight:bold;display:block;border-radius:4px;display:inline-block;text-decoration:none;padding:8px 14px;margin:10px auto;background:#ff2c6e;border:2px solid #ff2c6e;}
.btn-form a:hover{color:#fff!important;text-decoration:none;opacity:0.8;}
@media screen and (max-width:499px){
.btn-form a{font-size:14px;text-align:center;}
}


.icon01{padding:1px;background:#aa0023;color:#fff;font-size:14px;line-height:3.5em;text-align:center;margin-right:6px;width:50px;height:50px;}
.btn-brown a{font-size:1.2em;background:rgb(191,93,61);}
.btn-orange a{font-size:1.2em;background:rgb(255,141,28);}
.btn-green a{font-size:1.2em;background:#20bf20;}
.btn-purple a{font-size:1.2em;background:#cb60b3;}
.btn-red a{font-size:1.2em;background:rgb(255,141,28);}