@charset "utf-8";


/* contents */
/*----------------------------------------------*/
.caption{
	color	:	#000000;
/*	line-height	:	160%;*/
    font-size: 1rem;
    line-height: 2rem;
/*    text-align: justify;*/
}

#contents .caption{
	font-family	: 'Meiryo',sans-serif;
	line-height	: 21px;
        font-size:13px;
}
#contents .caption p,
#contents .caption div,
#contents .caption span,
#contents .caption u,
#contents .caption strong,
#contents .caption a
{
	font-family	: 'Meiryo',sans-serif;
}
#contents .caption h2{
    padding-top: 20px;
    font-size:18px;
    margin-bottom: 10px;
    padding-bottom: 5px;
    line-height: 29px;
    font-weight: bold;
	font-family	: 'Meiryo',sans-serif;
}
#contents .caption .exp{
	font-size:100%;
	margin: 10px 0;
	font-family	: 'Meiryo',sans-serif;
}
#contents .caption .note{
	font-size:100%;
	color: rgb(255, 0, 0);
	margin: 10px 0;
	font-family	: 'Meiryo',sans-serif;
}

#contents .caption strong {
	font-weight: bold;
}

#contents .caption p a {
	text-decoration: underline;
	color: #008080;
}

#contents .caption em {
	font-style: italic;
}

#contents .caption ol,ul {
	margin: 1em 0;
}

#contents .caption ol li {
	list-style: disc;
	margin-left: 3em;
}

#contents .caption ul li {
	list-style: decimal;
	margin-left: 3em;
}


/* productListTitle */
/*----------------------------------------------*/
#productListTitle{
	position	:	relative;
}
#productListTitle #appealIcon{
	width	:	80px;
	height	:	60px;
	position	:	absolute;
	top	:	7px;
	right	:	0px;
}
#productListTitle #appealIcon img {
    position: absolute;
    top: -11px;
    left: 4px;
}
#productListTitle #cpuIcons{
	width	:	310px;
	position	:	absolute;
	bottom	:	23px;
	left	:	25px;
}
#productListTitle #cpuIcons li{
	padding-right	:	5px;
	float	:	left;
}
#productListTitle #cpuIcons li img{
	width	:	auto;
	height	:	70px;
	position: relative;
    left: 12px;
}

/* basic */
/*----------------------------------------------*/
#basic{
	padding	:	0px 0px 25px 0px;
}
#basic .fL{
	width	:	200px;
}
#basic .fL h2{
	margin	:	0px 0px 10px 0px;
	font-size	:	18px;
	font-weight	:	bold;
	color	:	#072f54;
}
#basic .fL p{
	margin	:	15px 0px 0px 0px;
	line-height	:	160%;
	text-align	:	center;
}

#basic .fR{
	width	:	480px;
}
#basic .fR .spec{
	margin	:	0px 0px 15px 0px;
	line-height	:	160%;
	font-size	:	12px;
	color	:	#363636;
}
#basic .fR .borderBox{
	border	:	1px dashed #363636;
}
#basic .fR .borderBox p{
	padding	:	15px;
	line-height	:	160%;
	font-size	:	12px;
	color	:	#363636;
}



#basic #specBox{
/*	width	:	990px;*/
	padding	:	15px 0px 0px 0px;
	overflow	:	hidden;
  width: 900px;
  overflow: hidden;
  display: block;
}
#basic #specBox ul{
/*	width	:	990px;*/
  width: 900px;
}
#basic #specBox ul li{
/*	width: 90px;
	padding	:	1px;
	font-size	:	9px;
*/
	text-align: center;
	float: left;
	color: #FFF;
	width: 128.3px;
	padding: 1px;
	font-size: 12px;
}
#basic #specBox ul li span {
    display: block;
    padding: 2px 0;
    height: 20px;
}
.redIco{
	background-color: #bf264a;
}
.orangeIco{
	background-color: #eb912c;
}
.blueIco{
	background-color: #2587ba;
}
.greenIco{
	background-color: #68ab43;
}
.purpleIco{
	background-color: #bb349b;
}
.pinkIco{
	background-color: #e64c4f;
}


#basic #btnBox{
	margin	:	15px 0px 0px 0px;
	padding	:	15px 0px;
	background-color	:	#ebebeb;
}

#basic #btnBox ul{
	width	:	400px;
	margin	:	0px auto;
}
#basic #btnBox li{
	width	:	200px;
}
#basic #btnBox li a{
	display	:	block;
}
#basic #btnBox li .customBtn{
	width	:	190px;
	height : 40px;
	background-image	:	url("../../images/view/detail/customBtn_on.png");
	background-repeat	:	no-repeat;
	background-position	:	left bottom;
}
#basic #btnBox li .customBtn:hover img{
	visibility	:	hidden;
}
#basic #btnBox li .backBtn{
	width	:	190px;
	height : 40px;
	background-image	:	url("../../images/view/detail/backBtn_on.png");
	background-repeat	:	no-repeat;
	background-position	:	left bottom;
}
#basic #btnBox li .backBtn:hover img{
	visibility	:	hidden;
}


/* landing */
/*----------------------------------------------*/
#landing h2.title{
	font-size	:	36px;
	font-weight	:	bold;
	color	:	#073d87;
	text-align	:	center;
}
#landing .caption{
	padding	:	0px 0px 20px 0px;
	margin	:	0px 0px 20px 0px;
	border-bottom	:	5px solid #073d87;
	color	:	#073d87;
	font-size	:	15px;
}

#landing .landBox{
	width	:	740px;
	height	:	200px;
}
#landing .landL{
	background-image	:	url("../../images/view/detail/landingL.jpg");
	background-repeat	:	no-repeat;
	background-position	:	left bottom;
}
#landing .landL.landLNone{
	background-image	:	url("../../images/view/detail/landingL_bNone.jpg");
	background-repeat	:	no-repeat;
	background-position	:	left bottom;
}
#landing .landR{
	background-image	:	url("../../images/view/detail/landingR.jpg");
	background-repeat	:	no-repeat;
	background-position	:	left bottom;
}
#landing .landBox .photo{
	width	:	200px;
	height	:	200px;
}
#landing .landBox .photo img{
	width	:	198px;
	height	:	198px;
	border	:	1px solid #6499a6;
}
#landing .landBox .comment{
	color	:	#4d4d4d;
	line-height	:	150%;
	vertical-align	:	middle;
	font-weight	:	bold;
}
#landing .landL .comment{
	padding	:	0px 0px 0px 140px;
}
#landing .landR .comment{
	padding	:	0px 200px 0px 0px;
	text-align	:	right;
}

#landing #customBtn{
	margin	:	30px 0px 0px 0px;
}





/* custom */
/*----------------------------------------------*/
#custom .fL{
	width	:	226px;
	padding	:	0px 10px 0px 0px;
	border-right	:	1px dashed #6499a6;
	float : left;
}
#custom .fC{
	width	:	226px;
	padding	:	0px 10px 0px 10px;
	border-right	:	1px dashed #6499a6;
	float : left;
}
#custom .fR{
	padding	:	0px 0px 0px 8px;
	width	:	226px;
	float : left;
}
#custom h2.title{
	padding	:	5px 0px 5px 25px;
	margin	:	0px 0px 5px 0px;
	background-image	:	url("../../images/view/detail/customArrow.jpg");
	background-repeat	:	no-repeat;
	background-position	:	left center;
	font-size	:	18px;
	font-weight	:	bold;
	color	:	#003e92;
}

#custom .price{
	margin	:	0px 0px 15px 0px;
	font-weight	:	bold;
}
#custom .spec{
	margin	:	0px 0px 15px 0px;
	font-size	:	12px;
	line-height	:	140%;
	color	:	#363636;
}


/* tab */
/*---------------------------------------------------*/
#tab_area{
	/* width : 739px; */
	/* background-image: url(../../images/view/detail/tab_back.jpg); */
	background-repeat: no-repeat;
	padding-bottom: 1px;
	padding-left: 1px;
	border-bottom: 2px solid #003d99;
	height: 52px;
}
#tab_area > div{
	float : left;
	/* background-image: url(../../images/view/detail/tab_back.jpg); */
	background-repeat: no-repeat;
		cursor: pointer;
		line-height: 1;
/*		margin-right: 26px;*/
		margin-left: -1px;
/*		height: 51px;*/
  margin-right: 5px;
  height: 49px;
}
#tab_area > div:last-child{
	margin-right: 0;
}
#tab_area > div > img, #tab_area > div > a> img {
	background-color: #fff;
/*	height: 51px;
	width: 231px;
*/
  width: 13.85rem;
  height: 50px;
}
#tab_area_under {
    background-repeat: no-repeat;
    padding-left: 1px;
    border-top: 2px solid #003d99;
	margin-top: 30px;
	margin-bottom: 50px;
}
#tab_area_under > div {
    float: left;
    background-repeat: no-repeat;
    cursor: pointer;
    line-height: 1;
    margin-left: -1px;
    margin-right: 5px;
    height: 49px;
}
#tab_area_under > div:last-child {
	margin-right: 0;
}
#tab_area_under > div > img, #tab_area_under > div > a> img {
    background-color: #fff;
    /* width: 222px; */
    width: 13.85rem;
    height: 50px;
}
#tab1{
	margin : 0;
}
#landing{
	margin : 0;
}
#tab_zone{
	border-top : none;
	margin : 0;
}
#tab_zone .contBox{
	margin : 0;
}

.detailInBox{
	padding : 20px 0px 20px;
	/*border-bottom : 1px dashed #bbb;*/
}
.detailInBox h3{
	color : #063E89;
	font-weight: bold;
	line-height : 140%;
	margin-bottom : 10px;
}
.detailBottom{
/*	margin: 0 auto;
	width : 990px;
*/
	width : 900px;
}
.detailBottom .detailBottomLeft{
/*	width : 770px;*/
	float : left;
	padding-left: 15px;
    font-size: 13px;
	width: 560px;
	line-height: 1.5rem;
	text-align: justify;
}
.detailBottomLeft img {
    margin-top: 50px;
}
.detailBottom .detailBottomRight{
/*	width : 200px;*/
	float : right;
	width: 240px;
	height: auto;
    text-align: center;
    border: 1px solid gainsboro;
}
.detailBottom .detailBottomRight img {
	padding: 10px;
    border: none;
/*    width: 160px; */
        width: 200px;
	max-width: 100%;
	height: auto;
	margin: 0px;
}
.detailBottom img{
	width : 100%;
	padding: 2px;
/*	border: 1px solid #CCC;*/
}
.detailBottom a{
	color	:	#0000EE;
	text-decoration	:	underline;
}
.detailBottom a:hover{
	color	:	#6DAFFF;
}


.detailBottomr{
	width : 990px;
/*	margin: 0 auto;*/
}

.detailBottomr .detailBottomLeft{
	width : 200px;
	float : left;
}
.detailBottomr .detailBottomRight{
	width : 770px;
	float : right;
}
.detailBottomr img{
	width : 100%;
	padding: 2px;
	border: 1px solid #CCC;
}
.detailBottomr a{
	color	:	#0000EE;
	text-decoration	:	underline;
}
.detailBottomr a:hover{
	color	:	#6DAFFF;
}

#tab3,#tab2{
	margin-top : 20px;
}

#tab3 table {
    border-top: 2px solid #263137;
    border-bottom: 2px solid #263137;
}
#tab3 table tr {
    border-bottom: 1px solid #ACACAC;
}
#tab3 table th{
	width: 240px;
	padding : 10px 0;
	font-weight: bold;
}
#tab3 table td{
	padding : 10px 10px;
	line-height : 160%;
}
#tab3 table tr:nth-child(even) {
	background: #f7f7f7;
}

/*modellist*/

.modellist{
	/* width: 740px; */
	/* overflow: hidden; */
}
.modellist ul{
	/* width: 770px; */
}
.modellist ul li{
	/* width: 240px; */
	width: 284px;
	margin-right: 24px;
	padding-top: 15px;
	float: left;
}
.modellist ul li:last-child{
	margin-right: 0;
}

.modellist ul li p.price{
	/* width: 200px; */
	width: 100%;
	text-align: center;
	padding-top: 10px;
	padding-bottom: 10px;
	/* padding-right: 19px; */
	/* padding-left: 19px; */
	color: #000000;
}
.modellist ul li p.spec{
	/* width: 200px; */
	font-size: 12px;
	/* padding: 19px; */
	padding: 10px 30px;
	color : #000000;
}
.modellist ul li p .spsp{
	font-size: 14px;
	color : #000;
	padding : 2px 0;
	margin-bottom : 4px;
}

.modellist ul li h3{
	font-size	:	16px;
	font-weight	:	bold;
	color	:	#003e92;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 5px;
	margin-left: 0px;
	padding-top: 15px;
	padding-right: 15px;
	padding-bottom: 5px;
	padding-left: 15px;
}
.modellist ul li span.title span {
  color: black;
  font-weight: 500;
  font-size: 0.95rem;
  letter-spacing: 1px;
}
.modellist ul li span.title{
	background-image	:	url("../../images/view/detail/customArrow.jpg");
	background-repeat	:	no-repeat;
	background-position	:	left 14px;
	font-size	:	16px;
	font-weight	:	bold;
	color	:	#003e92;
	padding-top: 14px;
	padding-right: 0px;
	padding-bottom: 14px;
	padding-left: 25px;
	display	:	block;
	margin: 0px;
  background: none;
  text-align: center;
  padding: 10px 0px 0 0;
  font-size: 1.1rem;
  color: #0f61bd;
  line-height: 1.4rem;
  letter-spacing: 0;
  overflow-wrap: break-word;
  word-break: break-word;
}
.tx21{
	font-size: 21px;
}
.modellist ul li p.mthum{
	text-align: center;
/*	margin-bottom	:	15px;*/
}
.modellist ul li p.mthum img{
	width: 200px;
}
.models a{
	box-shadow: 0 1px 7px 0px #ccc;
	/* width: 238px; */
	/* padding-bottom : 55px; */
	padding-bottom: 10px;
	display : block;
}
.models a:after {
	content: "";
	/* width: 100%; */
	height: 5px;
	display: block;
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#263137+0,263137+100&1+0,0.5+49,1+100 */
	background: -moz-linear-gradient(left, rgba(38, 49, 55, 1) 0%, rgba(38, 49, 55, 0.5) 49%, rgba(38, 49, 55, 1) 100%);
	/* FF3.6-15 */
	background: -webkit-linear-gradient(left, rgba(38, 49, 55, 1) 0%, rgba(38, 49, 55, 0.5) 49%, rgba(38, 49, 55, 1) 100%);
	/* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right, rgba(38, 49, 55, 1) 0%, rgba(38, 49, 55, 0.5) 49%, rgba(38, 49, 55, 1) 100%);
	/* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#263137', endColorstr='#263137', GradientType=1);
	/* IE6-9 */
	position: absolute;
	top: 0px;
	left: 0px;
	right: -1px;

}
.models a:link,.models a:visited{
	/* width: 238px; */
}
.models .pc_back{
	background-color: white;
}
.modellist ul li .orderBtn{
	background-color: #F7F7F7;
	padding: 14px;
	text-align: center;
	/* position : absolute; */
	/* bottom : 0; */
	/* width : 210px; */
	border-top: 1px solid #EBEEF0;
	border-bottom: 1px solid #EBEEF0;
}


.models a {
  transition: 0.2s
}
.models a:hover {
  background: #053D99;
}

.models a:hover .orderBtn {
  background: #e4e4e4;
}
.models a:hover .orderBtn img {
  transition: .2s ease all;
  opacity: 1;
  filter: brightness(1.1);
  background: #989898;
  box-shadow: 0 2px 4px 1px #989898;
}
.models a:hover p.mthum img {
  opacity: 1;
}
.models a:hover  .pc_back {
  background: #f7f7f7;
  transition: .3s;
}
.models a:hover p.spec,
.models a:hover p.spec span {
  color: white;
}


h4.fea{
/*
	font-size: 14px;
	color: #375462;
	padding-left: 8px;
	border-left-width: 2px;
	border-left-style: solid;
	border-left-color: #375462;
	margin-bottom: 10px;
*/
	color: #fff;
    height: 40px;
    line-height: 40px;
    padding-left: 15px;
    background: #263137;
    margin-bottom: 25px;
    font-size: 18px;
}

.imgfull img{
	width: 100%;
}

.detailBottom .detailBottomLeft iframe{
	margin-top: 10px;
}

.orderBtn img {
    width: 246px;
}


/* 製品ページ表組み */
table.pdt_table, table.pdt_table td, table.pdt_table th {
    border-top: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
}