@charset "UTF-8";

/* =======================================================================

CSSの名前：allion.css アリオンストア用

--------------------------------------------------------------------------*/
#ALLION{width:100%;font-size:62.5%;}

#ALLION div,#ALLION dl,#ALLION dt,#ALLION dd,#ALLION ul,#ALLION ol,#ALLION li,
#ALLION h1,#ALLION h2,#ALLION h3,#ALLION h4,#ALLION h5,#ALLION h6,#ALLION pre,#ALLION code,
#ALLION form,#ALLION fieldset,#ALLION legend,#ALLION input,#ALLION textarea,#ALLION p,
#ALLION blockquote,#ALLION th,#ALLION td {
	box-sizing: border-box; -webkit-box-sizing: border-box;
	font-family:"メイリオ",Meiryo,"Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3","ＭＳ Ｐゴシック",Verdana, Geneva, Helvetica,Arial,Verdana,sans-serif;
}

#ALLION .small{font-size: 80%;}
#ALLION .bigTxt{font-size: 120%!important;}
#ALLION a:hover{text-decoration: none;}




/* 使用ファイル：common/header4.xhtml

=================================================================*/

/* header - ヘッダ

-------------------------------------------------------------*/
#aHeaderWrap{padding:96px 0 0 0;}
#aHeader{position: fixed!important;top: 0;height:100px;width:100%;box-sizing: border-box;border-top:10px solid #3bd1c3;border-bottom:1px solid #eee;padding-top:10px;background:#fff;z-index:10;}

#aHeader #aHeader-Inner{width:1095px;display: flex; margin:0 auto;display: flex;line-height: 1.0;}

#aHeader a:hover img{opacity: 1.0!important;}

#aHeader #logoBox{width:635px;margin:5px 0 4px;}

#aHeader #rBox{width:450px;margin-top:10px;}

#aHeader #headNav{font-weight: bold;display: flex;color:#fff!important;text-align: center;padding-top: 13px;margin: 0 0 0 auto;}
#aHeader #headNav a:link{color: #fff;text-decoration: none;}

#aHeader #headNav .headIcon{width:32px;height:30px;text-align: center;margin-left: 20px;background-position: top center;color: #fff;}

#aHeader #headNav #newRegist{background: url("../images/allion/hicon_regist.png") no-repeat;}
#aHeader #headNav a:hover #newRegist{background: url("../images/allion/hicon_regist_on.png") no-repeat;}

#aHeader #headNav #myPage{background: url("../images/allion/hicon_mypage.png") no-repeat;padding-top: 40px;}
#aHeader #headNav a:hover #myPage{background: url("../images/allion/hicon_mypage_on.png") no-repeat;}

#aHeader #headNav #logIn{background: url("../images/allion/hicon_login.png") no-repeat;padding-top: 40px;}
#aHeader #headNav a:hover #logIn{background: url("../images/allion/hicon_login_on.png") no-repeat;}

#aHeader #headNav #logOut{background: url("../images/allion/hicon_logout.png") no-repeat;padding-top: 40px;}
#aHeader #headNav a:hover #logOut{background: url("../images/allion/hicon_logout_on.png") no-repeat;}

#aHeader #headNav #Cart{background: url("../images/allion/hicon_cart.png") no-repeat;}
#aHeader #headNav a:hover #Cart{background: url("../images/allion/hicon_cart_on.png") no-repeat;}

#aHeader #headNav #Cart #cartAmount{color:#CC0000;font-size:11px;font-weight: bold;line-height: 1.0;height:33px;margin: 4px 6px 0 0!important;} 

#aHeader ul#aHheadMenu{margin: 0 0 15px;width:400px; margin-left: auto;}
#aHeader ul#aHeadMenu li{float: right;font-size:12px;padding:0 10px;color:#000!important;}
#aHeader ul#aHeadMenu a{color: #000!important;text-decoration: none;}
#aHeader ul#aHeadMenu li:hover{text-decoration: underline;}

#aHeader .search-form{display: flex;justify-content: space-between; align-items: center; width: 250px; overflow: hidden; border-radius: 3px; background-color: #f2f2f2;	padding-right:10px; margin: 12px 10px 10px 10px;}
#aHeader .search-form input{width: 210px; height: 34px; padding: 0 15px; border: none; box-sizing: border-box; background-color: #f2f2f2; font-size: 14px; outline: none;}
#aHeader .search-form input::placeholder {color: #777777;}
#aHeader .search-form button{display: flex; justify-content: center; align-items: center; width: 40px; height: 34px; border: none; cursor: pointer;}
#aHeader .search-form button::after {width: 40px; height: 23px; background-image: url( "../images/allion/hicon_search.png");background-repeat: no-repeat; content: '';}

/* =================================================================

フッタ

使用ファイル：common/footer4.xhtml

=================================================================*/
#ALLION #footerMenu{margin:0 auto;color:#ddd; text-align:center;}
#ALLION #footerMenu ul{display: inline-block;text-align: left;margin-top:100px;}
#ALLION #footerMenu li{float:left;padding:2px 20px;border-right: 1px solid #333;}
#ALLION #footerMenu li:last-child{border-right: none;}

#ALLION #footerMenu li a{color:#333; text-decoration:none;font-size:1.4em;}
#ALLION #footerMenu li a:hover{text-decoration:underline;}

#aFooter{width:100%;background:#222!important;margin:20px auto 0;}
#aFooter #inner{display: flex; zoom:1;width:1095px; position:relative; margin:0 auto;padding:10px;}

#aFooter .globalsign{width:250px;margin:10px 0 ;}


#aFooter #copyright{clear:both; color:#fff; margin:20px 0 0 0; font-size:1.8em; text-align:center;font-family:monospace; }
#aFooter #copyright span{font-size:70%;}


/* =================================================================

トップページ

使用ファイル：top4.xhtml

=================================================================*/
#ALLION #container{width:100%; padding:0 0 50px;z-index: 1;}




/* mainVisual - メインビジュアル
-------------------------------------------------------------*/

#ALLION #mainVisual{background: url("../images/allion/top_mainimg.jpg") no-repeat center center / cover; width: 100%; height: 500px;;margin-bottom:20px;}
#ALLION #mainVisual-Inner{width:1095px;margin:0 auto;display: flex;}
#ALLION #mainVisual-InnerL{width:640px;margin-right: 25px;}
#ALLION #mainVisual-InnerL h1{font-size: 3.6em;color:#fff;margin: 80px 0 30px;border-bottom: 2px solid #fff;}
#ALLION #mainVisual-InnerL h2{font-size: 2.4em;color:#fff;}
#ALLION #mainVisual-InnerL h3{font-size: 1.9em;color:#ffe451;margin-bottom: 30px;}
#ALLION #mainVisual-InnerL p{font-size: 1.6em;color:#fff;}
#ALLION #mainVisual-InnerR{background: url("../images/allion/website-1-11-2.png")no-repeat right top 20px;;width:450px;height: 500px;text-align: right;padding-top: 100px;}
#ALLION #mainVisual-InnerR img{width:300px;}

/* コンテンツ
-------------------------------------------------------------*/

#ALLION .topContents{width:1175px; margin:0 auto;padding:60px 0;}

#ALLION .topContents h2{clear:both;font-size:3.6em;text-align: center;line-height: 0.9em;margin: 0;}
#ALLION .topContents h2 span{font-size:50%;}
#ALLION .topContents h3{width:1095px;font-size:2.2em;text-align: center;line-height: 0.9em;margin: 50px auto 40px;padding-bottom: 10px; border-bottom: 3px solid #333;}

#ALLION #rankingArea{display: flex;width:1000px;margin: auto;}
#ALLION .rankingBox{width:215px;margin:40px 15px 0;font-size:1.6em;float:left;}
#ALLION .rankingBox img{width:215px;border:1px solid #ccc;margin-bottom:5px;}
#ALLION .rankingBox div:hover img{border:2px solid #3bd1c3;opacity: 1.0;}
#ALLION .typeIcon{background: #22589c;color:#fff; padding:3px 8px 2px;font-size: 12px;font-weight: bold;}
#ALLION .rankingBox p{margin-top:5px;}
#ALLION  a .rankingBox p{color:#222;}

/* 製品一覧
-------------------------------------------------------------*/

#ALLION #categoryArea{width:100%;margin:80px 0!important;padding:  40px 0!important;background: #e6e6e6;}

#ALLION ul.catBox {display: flex; flex-wrap: wrap;width: 1172px;padding:0 0 15px; margin: 0 auto;}
#ALLION ul.catBox li{width:283px;height: 120px;background: #fff; padding:45px 0 0;margin:0 5px 15px;font-size: 1.9em;font-weight: bold;box-sizing: border-box;text-align: center;border:1px solid #097f74;}

#ALLION ul.catBox li img{}
#ALLION ul.catBox a li{color:#02564e;}
#ALLION ul.catBox a li:hover{background: #b7f6f0;}

/* news - ニュース
-------------------------------------------------------------*/

#ALLION #newsArea{width: 1095px;background: #fff;margin:40px auto 0;}

#ALLION #newsArea dl.news{width:1095px;margin: auto;}
#ALLION #newsArea dt{font-weight: normal;width:110px;padding:15px 10px 6px;font-weight: normal;font-size: 1.4em;}
#ALLION #newsArea dd{padding:4px 10px 6px 10px;font-size: 1.8em; color:#333;text-align: left;border-bottom: 2px solid #666;}
#ALLION #newsArea dd img{margin:0px 10px 0 0}

#ALLION #newsArea dd a{color: #000!important;text-decoration: none;}
#ALLION #newsArea dd:hover{text-decoration: underline;}

#ALLION #newsArea .newsArchive{margin: 20px 0 0 auto;font-size: 1.5em;text-align: right;}
#ALLION #newsArea .newsArchive a {text-decoration: none; color: #333!important;}
#ALLION #newsArea .newsArchive a:hover{ color: #22c0b1!important;}


/* ボトムバナー
-------------------------------------------------------------*/

#ALLION .flexBnrArea{display: flex;width:1095px;margin:120px auto 0;}
#ALLION .btmBnr{display: block; width:480px;height: 80px; color:#000;font-size:2.6em;font-weight:bold;margin:0 28px;border-radius: 8px;text-align: center;box-sizing: border-box;}
#ALLION .btmBnrAllion{background:#f4f4f4; border: 1px solid #aaa;padding-top: 22px;}
#ALLION .btmBnrContact{background:#3bd1c3 url("../images/allion/btmbnr_contact.png")no-repeat right 10px bottom 0;text-align: left;color: #fff;padding: 20px 0 0 80px;box-sizing: border-box;border:1px solid #22c0b1;}
#ALLION .btmBnrAllion img{opacity: 1.0;}


#ALLION a:hover .btmBnrAllion{background:#d1cf3b;}
#ALLION a:hover .btmBnrContact{background:#128e82 url("../images/allion/btmbnr_contact.png")no-repeat right 10px bottom 0;}
#ALLION .flexBnrArea a{color:#fff;}
#ALLION .flexBnrArea a:hover{text-decoration: none;}





/* =================================================================

カテゴリページ

=================================================================*/

#ALLION .catContents{width:1095px; margin:60px auto 100px;padding:0;}

#catTTL_interface{background: url("../images/allion/cat_bg01.png") no-repeat center center / cover; width: 100%; height:180px;font-size:4.6em;color:#fff;text-align: center;padding-top:60px;}
#catTTL_maker{background: url("../images/allion/cat_bg02.png") no-repeat center center / cover; width: 100%; height:180px;font-size:4.6em;color:#fff;text-align: center;padding-top:60px;}

#ALLION .catContents h2{clear:both;font-size:4.0em;text-align: center;line-height: 0.9em;margin: 0 0 30px;}
#ALLION p.txtRead{width:1055px;margin:0 auto;font-size:1.8em;}

#ALLION ul#catMenu {display: flex; flex-wrap: wrap;width: 1172px;padding:0 0 15px; margin: 50px auto;}
#ALLION ul#catMenu li{width:283px;height: 100px;background: #fff; padding:35px 0 0;margin:0 5px 20px;font-size: 1.9em;font-weight: bold;box-sizing: border-box;text-align: center;}

#ALLION ul#catMenu li.menuON{background: #099689;color:#fff; border:1px solid #ccc;}
#ALLION ul#catMenu li.menuOFF{background: #eae5e5;color:#333; border:1px solid #aaa;}
#ALLION ul#catMenu li.menuOFF:hover{background: #b7f6f0;}

#ALLION .itemArea{display:flex; flex-wrap: wrap; nowrap;width:1080px!iportant;margin: 50px auto 0;}
#ALLION .itemBox{width:250px;margin:20px 10px 50px;font-size:1.6em;float:left;}
#ALLION .itemBox img{width:250px;border:1px solid #aaa;margin-bottom:5px;}
 
#ALLION .itemBox .typeIcon{background: #22589c;color:#fff; padding:3px 8px 2px;font-size: 12px;font-weight: bold;}
#ALLION .itemBox p{margin-top:5px;}

#ALLION hr{clear:both;width:1095px;margin:80px auto 110px;display:clock; }

#ALLION .contactItemArea{width:1095px;margin:60px auto;}
#ALLION .contactTxt{font-size: 3.0em;text-align: center;margin-bottom: 10px;}
#ALLION .contactItemArea .btmBnr{margin: auto;}
#ALLION .contactItemArea .wilderTbl {width:1055px;margin:50px auto;}
#ALLION .contactItemArea .wilderTbl thead th{background: #eeeeee;font-size:1.3em;font-weight: normal;padding: 5px 0;}
#ALLION .contactItemArea .wilderTbl td{border-bottom:1px solid #999!important;font-size:1.3em;padding:5px 10px;}
#ALLION .contactItemArea .wilderTbl caption{font-size:1.8em;font-weight: bold;text-align: center;background: #acede7;padding: 10px 0;border-bottom: 3px solid #3bd1c3;}

#ALLION .contactItemArea .wilderTbl tr td:first-child{display: none;}
#ALLION .contactItemArea .wilderTbl tr th:first-child{display: none;text-align: center;}
#ALLION .contactItemArea .wilderTbl tr td:nth-child(3){white-space: nowrap;width: 140px;text-align: center;border-left: 1px dashed #ccc;}


#page_top{width: 50px;height: 50px;position: fixed;right: 0;bottom: 0;background: #444;opacity: 0.6;border-radius: 50%;}
#page_top a{position: relative;display: block;width: 50px;height: 50px;text-decoration: none;}
#page_top a::before{font-family: FontAwesome;content: '\f102';font-size: 25px;color: #fff;position: absolute;width: 25px;height: 25px;top: 0;bottom: 10px;right: 0;left: 0;margin: auto;text-align: center;}




/* =================================================================

商品ページ

使用ファイル：item_details4.xhtml

=================================================================*/

#ALLION #itemDetail .explanation1{margin: 0!important;padding:10px 0 10px;}
#ALLION .explanation1 .type_on{font-size:14px;padding:5px 10px;border:3px solid #ffcc02;background: #ffde5a;margin: 10px 10px 10px 0;}
#ALLION .explanation1 .type_link{font-size:14px;padding:7px 10px;border:1px solid #999;text-decoration: underline;margin: 10px 10px 10px 0;}
#ALLION .explanation1 a:hover .type_link{background: #BCE4F5;}

#ALLION #itemDetail h1.itemName{display:block; margin:0!important; font-size:25px!important; color:#444444;}
#ALLION #itemDetail h2{display:block; height:auto; font-size:15px; padding:0; background:none; font-weight:normal; color:#333;line-height: 1.4em;}
#ALLION #itemDetail .price{padding-top: 50px!important;font-weight: normal!important;}


#ALLION #itemDetail #products .slides_container{width:400px;height:400px; margin:0px;overflow:hidden;position:relative;border:1px solid #ccc;}

#ALLION #itemDetail #products .slides_containern img{width:380px;height:380px;top:0;left:0;position:absolute;}


#ALLION #iDetailContents{width:1095px; margin:60px auto 100px;padding:0;}

#ALLION  #itemDetail .textBox{float:right; width:600px;}


#ALLION .inquirybutton{display: flex;flex-wrap: wrap;clear:both;border-top: 1px solid #999;padding: 15px  0 0;margin:30px 0 0;}
#ALLION .inquirybutton .grnBtn{width:230px; margin:15px 20px 0 0;padding:6px 0 5px;font-size: 1.8em; text-align: center;border:3px solid #3bd1c3; color:#3bd1c3;}
#ALLION .inquirybutton a:link .grnBtn{text-decoration: none;}
#ALLION .inquirybutton .grnBtn:hover{background:#3bd1c3; color:#fff; }


#ALLION .itemName{border-bottom: 1px solid #999;padding: 0  0 30px;margin:0 0 15px;}


#ALLION input.cart{padding-left: 35px; background: #d60000; background-image: url(../images/svg/cart.svg); background-repeat: no-repeat; background-size: 24px 23px; background-position: 65px 17px; height: 60px; line-height: 60px; border: 1px solid #d60000; color: #FFF; font-size: 22px;}
#ALLION input.cart:hover{background: #FFF; background-image: url(../images/svg/cart_hover.svg); background-repeat: no-repeat; background-size: 24px 23px; background-position: 65px 17px; height: 60px; line-height: 60px; transition: 0.5s; color: #d60000;}
#ALLION .btn{margin: 0 auto; padding: 0 20px; height: 45px; line-height: 45px; font-size: 16px; letter-spacing: 2px;}

#ALLION #itemDetail .cartbutton td{vertical-align: top;}

#ALLION #itemDetail .amount{display: inline-block; vertical-align: top;}
#ALLION #itemDetail .amount{margin-right: 24px; width: 120px;}
#ALLION #itemDetail .amount dl{}
#ALLION #itemDetail .amount dt{padding: 3px 0; font-size: 14px; background: #111111; color: #FFF; text-align: center;}
#ALLION #itemDetail .amount dd {height: 30px; }
#ALLION #itemDetail .amount dd input{width: 100%;font-size: 16px;text-align:center;padding:5px 10px;-moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;background: #F6F9C0;}
#ALLION #itemDetail .cart_btn{display: inline-block;}
#ALLION #itemDetail .cart_btn input.cart{width: 310px; text-align: center;}
#ALLION #itemDetail .cart_btn .no_btn{width: 310px; padding-left: 35px; height: 60px; line-height: 60px; background-image: url(../images/svg/no_cart.svg); background-repeat: no-repeat; background-size: 24px 23px; background-position: 65px 17px; font-size: 22px;}


#ALLION #itemDetail .explanation3{width:985px;margin:0 auto;font-size: 1.6em;}
#ALLION #itemDetail .explanation3 h2{background:#3bd1c3; color:#fff;padding:10px 20px 8px 20px;margin:50px 0 20px;font-size: 120%;}



/* breadcrumbsline - パンくず

-------------------------------------------------------------*/
#ALLION #breadcrumbsline {width:1095px;color:#333333; font-size:15px;padding: 5px 0 0 0;height: 28px;margin:30px auto 15px; white-space:nowrap; overflow:hidden;}

#ALLION #breadcrumbsline a{color:#333333;}

#ALLION #breadcrumbsline a:hover{text-decoration:none;}



/* =================================================================

カテゴリページ

使用ファイル：item_list$4_image.xhtml

=================================================================*/


/* itemListImage - 商品一覧

-------------------------------------------------------------*/
#ALLION #categoryContents{width:1095px; margin:60px auto 30px;padding:0;}


#ALLION #category_html {margin:20px auto;}

#ALLION #itemList #cInfo{clear:both;margin:0 auto;padding-bottom: 30px;}

#ALLION #itemList #cInfo p{font-size:18px;}

#ALLION #itemList #cInfo p+p{margin-top:5px;}

#ALLION #itemListImage{margin:20px 22px;clear: both;}


#ALLION #itemListImage a{ color:#000;}

#ALLION #itemListImage h2{display:block; height:22px; font-size:15px; padding:0px; font-weight:normal; color:#000;letter-spacing: 5px;}

#ALLION #itemListImage:after{content:"."; display:block; visibility:hidden; height:0.1px; font-size:0.1em; line-height:0; clear:both;}/* clearfix */

#ALLION #itemListImage .box{float:left; width:192px; height:350px; padding:0;margin:15px 9px;overflow:hidden; position:relative; }

#ALLION #itemListImage .text{width:174px;}

#ALLION #itemListImage h3{display:block; margin:10px 0 0; font-size:14px; font-weight:normal; line-height:1.3em; height:45px;}

#ALLION #itemListImage .text_iconprice{}

#ALLION #itemListImage .price a:link{ color:#333;margin: 0!important;}

#ALLION #itemListImage .price{font-size:13px;margin: 0!important;padding:0!important;line-height: 1.8em;}

#ALLION #itemListImage .memberprice {background-color:#ff4500; color:#ffffff;padding: 5px 5px 0 5px;line-height: 2.0em;}

#ALLION #itemListImage .price .red{color:#ff0000;}

#ALLION #itemListImage .priceBig{font-size:20px;}

#ALLION #itemListImage .item_icon{float:left;}

#ALLION #itemListImage .itemBox{width:190px;height:190px;padding:0;margin: 0 0 10px;box-sizing: border-box;}

#ALLION #itemListImage .itemBox img{display:block; width:182px; height:182px;margin:3px;box-sizing: border-box;}

#ALLION #itemListImage .iconarea{ position:absolute; top:5px; left:5px; z-index:2;}


/* list - 一覧画面共通のメニュー

-------------------------------------------------------------*/

#ALLION #list .pageNavi{clear:both;background: #f7f6f4;width: 1055px; margin: 20px auto;padding:10px 15px;}

#ALLION #list .pageNavi:after {content: "";display: block;clear: both;}#ALLION #list .pageguide{float:left; width:770px; font-size:13px;}

#ALLION #list .rearrange{float:right; width:200px; font-size:13px; text-align:right;}