@charset "UTF-8";

/*clearfix----------------------------------------------*/

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

.clearfix{
	display: inline-block; 
} 

.clearfix{
	display: block; 
} 

/* for only MacIE \*//*/

.clearfix { 
	overflow: hidden; 
}
  
/* */
A:active{
	text-decoration:none ;Color:#4c4c4c;
}
A:link{
	text-decoration:none ;Color:#5544cc;
} 
A:visited{
	text-decoration:none ;Color:#5544cc;
}
A:hover{
	text-decoration: none;Color:#ff8000;
}
span.here{
	color: #ff8000;
}
ul{
	margin:0;
	padding:0;
	list-style-type: none;
}

html{
	background-color: transparent;
	background-image: url(../image/background/comn_bk.jpg);
	background-repeat: repeat;
	background-attachment: scroll;
	background-position: 0% 0%;
}
#wrapper{
	font-size:12px;
	width:984px;
	margin:0 auto;
	margin-bottom: 23px;
}
#header{
	width:984px;
	height:62px;
}
#header p{
	float:left;
       margin-top: 8px;
       margin-left: 7px;
}
#header ul{
	float:left;
}
#header ul li{
	float:left;
}
ul.lang1{
	margin:15px 0 0 120px;
}
ul.lang1 li{
	margin:0 5px;
}
ul.lang2{
	margin:20px 0 0 45px;
       float:left;
}
ul.lang2 li{
	margin:0 5px;
}
ul.gmenu1{
	margin:7px 0 0 101px;
}
ul.gmenu1 li{
	margin: 0 0 0 14px;
	line-height:17px;
}
ul.gmenu2{
	margin:20px 0 0 110px;
       float:left;
}
ul.gmenu2 li{
	margin: 0 0 0 14px;
}
form{
	margin:10px 0 0 0;
	width:233px;
	float:right;
}

font{
	height:13px;
}
body{
	color:#505070;
	font-family: 'メイリオ' ,Meiryo, 'ヒラギノ角ゴ Pro W3' , 'Hiragino Kaku Gothic Pro' , 'ＭＳ Ｐゴシック' , 'Osaka' ,sans-serif;

}
#pgroup ul li{
	float: left;
	line-height: 0;
}
#pgroup ul.ptrack{
	background: url("../img/comn_ptrack_sd.png") repeat-x;
	height: 30px;
}
#footer{
	float: left;
	width: 984px;
	margin-top: 25px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	margin-bottom: 50px 0 0;
	background-image : url(../image/comn_footerimg01.png);
	height: 123px;
}
#footer ul{
	padding:0px 0 0 0px;
}
#footer ul li{
	float:left;
}
#footer p{
	padding: 3px 0 10px 20px;	
}

#smenu{
	width:198px;
	float:left;
}
#smenu p{
	margin:0;
}
#smenu ul li{
	line-height:0;
}
#smenu ul li dd{
	margin: 0px;
	width: 198px;
	background: transparent url(../img/compact_smbtn02_bk.png) no-repeat scroll 0% 0%;
}
#smenu ul li dd li{
	padding:0px 0 0 0px;
	height:24px;
}
.smenu2{
	margin-top: 80px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	float: left;
	background-image: url(../img/comn_sm2_bk.png);
	width: 198px;
	height: 196px;
}
.smenu2 ul li{
	margin-top: 10px;
	margin-left: 10px;
	margin-right: 10px;
	margin-bottom: 15px;
}
.smenu2-2{
	margin-top: 80px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	float: left;
	background-image: url(../img/comn_sm2_2_bk.png);
	width: 198px;
	height: 134px;
}
.smenu2-2 ul li{
	margin-top: 10px;
	margin-left: 10px;
	margin-right: 10px;
	margin-bottom: 15px;
}
.smenu2-3{
	margin-top: 80px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	float: left;
	background-image: url(../img/comn_sm2_3_bk.png);
	width: 198px;
	height: 258px;
}
.smenu2-3 ul li{
	margin-top: 10px;
	margin-left: 10px;
	margin-right: 10px;
	margin-bottom: 15px;
}

.smenu2-4{
	margin-top: 80px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	float: left;
	background-image: url(../img/comn_sm2_4_bk.png);
	width: 198px;
	height: 72px;
}
.smenu2-4 ul li{
	margin-top: 10px;
	margin-left: 10px;
	margin-right: 10px;
	margin-bottom: 15px;
}
img{
	border-style: none;
	transition: .4s
}
dl{
	margin-top: 0px;
	margin-left: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
}
p{
	margin-top: 0px;
	margin-left: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
}

h2{
	 
margin-top: 0px; 
margin-bottom: 0px;
}

h3{
	 
margin-top: 0px;
 margin-bottom: 0px; 
}

p{
	 
margin-top: 0px; 
margin-bottom: 0px;
}

#contentsArea{
		margin:13px 0 0 0;

}


#product{
	float:right;
	width:766px;
}
h1{
	margin-top: 0px;
}
#product .ptop{
	height : 78px;
}
#product .pfooter{
	height : 10px;
}

.ptop{
	background-image : url(../image/background/comn_contentsbk01.png);
}
.pcontents{
	background-image : url(../image/background/comn_contentsbk02.png);
	background-repeat: repeat-y;
}
.pfooter{
	background-image : url(../image/background/comn_contentsbk03.png);
}
.pagetop{
    display: none;
    position: fixed;
    bottom: 40px;
    right: 45px;
}
.pagetop a{
    display: block;
    background-color: #0022ff;
    text-align: center;
    color: #ffffff;
    font-size: 17px;
    text-decoration: none;
    padding:23px 8px;
	filter:alpha(opacity=70);
    -moz-opacity: 0.8;
    opacity: 0.75;
    border-radius: 40px;     /* CSS3 */
    -moz-border-radius: 36px;    /* Firefox */
    -webkit-border-radius: 36px; /* Safari,Chrome */
}
.pagetop a:hover{
    display: block;
    background-color: #2266ff;
    text-align: center;
    color: #00ff00;
    font-size: 17px;
    text-decoration: none;
    padding:23px 8px;
	filter:alpha(opacity=50);
    -moz-opacity: 0.8;
    opacity: 0.75;
}

/*カーソルを当てるとふわっと透過する----------------------------------------------*/
.fade:hover{
opacity: 0.5;
transition: .4s;
} 

/*カーソルを合わせるとふわっと浮き上がる----------------------------------------------*/
.shadow:hover{
	box-shadow: 2px 2px 3px rgba(30, 60, 60, 0.5);
transition: .3s;
}

/*点滅する----------------------------------------------*/
.blinking {
    -webkit-animation: 0.6s linear 0s alternate none infinite running blink;
    -moz-animation: 0.6s linear 0s alternate none infinite running blink;
    animation: 0.6s linear 0s alternate none infinite running blink;
}
@-webkit-keyframes blink {
    0% { opacity: 0; }
    19.9% { opacity: 0; }
    20% { opacity: 1; }
    100% { opacity: 1; }
}
@-moz-keyframes blink {
    0% { opacity: 0; }
    19.9% { opacity: 0; }
    20% { opacity: 1; }
    100% { opacity: 1; }
}
@keyframes blink {
    0% { opacity: 0; }
    19.9% { opacity: 0; }
    20% { opacity: 1; }
    100% { opacity: 1; }
}
.modern-table-container {
  max-width: 680px;
  margin: 40px auto;
  background-color: #f5f0fa;
  border-radius: 10px;
  box-shadow: 0 4px 10px rgba(0,0,0,0.08);
  overflow: hidden;
  font-family: 'Lucida Sans Unicode', 'Segoe UI', 'Meiryo', sans-serif;
  font-size: 14px;
}
.modern-table-container h2 {
  background-color: #6f6fff;
  color: #ffffff;
  padding: 6px 16px;
  margin: 0;
  font-size: 1.05rem;
  font-weight: normal;
  border-bottom: 1px solid #ccc;
  line-height: 1.4;
}
.modern-table {
  width: 100%;
  border-collapse: collapse;
}

.modern-table tr:nth-child(odd) {
  background-color: #ffffff;
}

.modern-table tr:nth-child(even) {
  background-color: #e8e8ff;
}

.modern-table td {
  padding: 6px 12px; 
  vertical-align: middle;
  text-align: left;
  font-size: 0.95rem; 
  border-right: 1px solid #ccc;
}
.modern-table td:last-child {
  border-right: none;
}
.modern-table td.code {
  text-align: center;
}

.modern-table td.price {
  text-align: center;
  color: #ff0000;
  line-height: 1.4em;
}

/* セール価格対応 */
.modern-table .original-price {
  text-decoration: line-through;
  color: #888;
  font-size: 0.95rem;
  display: block;
}

.modern-table .discounted-price {
  color: #ff0000;
  font-size: 0.95rem;
  display: block;
}
.modern-table td.name {
  width: 60%; /* 商品名列を広めに */
}

.modern-table td.code {
  width: 20%; /* 型番列を中くらいに */
}

.modern-table td.price {
  width: 20%; /* 価格列を狭めに */
}
.section-header-row td {
  background-color: #eeeeee;
  color: #3377ee;
  font-family: "Lucida Sans Unicode", sans-serif;
  font-size: 130%;
  text-align: left;
  padding: 10px 12px;
}

.section-header {
  background-color: #eeeeee;
  color: #3377ee;
  font-size: 130%;
  font-weight: bold;
  height: 32px;
  border-top: 2px solid #3366ee;
  border-bottom: 1px solid #ccc;
}
.modern-nav-container {
  width: 90%;
  margin: 0 auto;
  border: 1px solid #ccccff;
  border-radius: 10px;
  background-color: #ffffff;
  padding: 8px 0;
  box-shadow: none;
}
.modern-nav-container {
  width: 90%;
  margin: 0 auto;
  border: 1px solid #ccccff;
  border-radius: 10px;
  background-color: #ffffff;
  padding: 4px 0; /* ← 縦の余白を縮小 */
  box-shadow: none;
}
.modern-nav-container {
  position: relative; /* これで子の絶対位置が基準になる */
  width: 100%;
  overflow-x: auto;   /* はみ出し防止 */
  box-sizing: border-box;
}

.modern-nav-links {
  display: flex;
  justify-content: center;
  gap: 30px;
  font-family: "Lucida Sans Unicode", sans-serif;
  font-size: 1rem; /* ← フォントサイズ控えめ */
  line-height: 1.2;
}

.modern-nav-links a {
  text-decoration: none;
  color: #0000cc;
  font-weight: normal; /* ← 太字解除 */
  padding: 4px 8px; /* ← 上下パディング縮小 */
  border-radius: 4px;
  background-color: transparent;
  box-shadow: none;
}

.modern-nav-links a:hover {
  background-color: #f0f0ff;
  color: #000099;
}