﻿/*
channel code : y5TPvfE6Mde6
for BtoB
*/ 
@charset "utf-8";
/* campaign_css */
#campaign_cont{width: auto;}
#campaign_cont .sale_h2{ font-size:32px; line-height:1.3; font-weight:700; margin:32px 0 16px;}
/* */

#campaign_cont h1{
	font-size: 35px!important;
}

.ssd_customize{
	width:870px;
	margin:0 auto;
}
.ssd_hikakubox{
	padding:20px 0 30px;
	background:#F0F0F0;
	}

#cam_openblock{ padding:0 10px 30px;}
/* coupon No. */
/*  */
.cam_w480{
    width: 480px;
}
.cam_w480 .cam_btn a,
.cam_w480 .cam_btn_orange a{width: 380px; padding: 10px 0; border: none;}
.cam_w480 .cam_btn a span{font-size: 120%;font-weight: bold;}
#campaign_cont ul.target { border-bottom:1px solid #000;   display: flex;}
#campaign_cont ul.target:last-child { border-top:1px solid #000;border-bottom:none;}
#campaign_cont ul.target li { width:50%;vertical-align: bottom;}
#campaign_cont ul.target:last-child li {vertical-align: top;}
#wrapper #body #campaign_cont ul.target li a { display: block; font-size: 18px!important; font-weight:700;padding: 16px 0; color:#666; }
#wrapper #body #campaign_cont ul.target li.on a,#wrapper #body #campaign_cont ul.target li a:hover { color:#000;  background-color:#DEE3ED;}
#campaign_cont ul.target:last-child li a { display:inline-block; width:100%; height:100%; padding: 16px 0 ; }
#campaign_cont ul.target li a:after {
    width: 100%;
	height:1px;
	display:block;
	border:none;
	vertical-align: bottom;
    -webkit-transform: rotate(0deg); 
    transform: rotate(0deg); 
}
#campaign_cont ul.target li a:hover:after,
#campaign_cont ul.target li.on a:after {
    top: 100%;
    width: 100%;
	height:1px;
	display:block;
    border-bottom: 3px solid #364563;
}
#campaign_cont ul.target:last-child li a:after {
	vertical-align: top;
}

#campaign_cont ul.target:last-child li a:hover:after,
#campaign_cont ul.target:last-child li.on a:after {
    top: 0;
    bottom: 100%;
    border-top: 3px solid #364563;
    border-bottom: none;
}
#campaign_cont .cam11b_980 { width: 980px; margin: auto;}
#campaign_cont .cam11b_box.cam11b_bk { width: auto; background-color: #f5f5f5;}
.cam11b_of_bnr{ text-align:center;}.cam11b_of_bnr a{ display:inline-block;}
/* hukidasi */
.cam_hukidasi {
  position: relative;
  display: inline-block;
  margin: 1.5em 0;
  padding: 16px 1.5em;
  color: #FFF;
  font-size: 20px;
  background: #475c85;
  border-radius: 20px;
}

.cam_hukidasi:before {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -15px;
  border: 15px solid transparent;
  border-top: 15px solid #475c85;
}
.cam_uparrow{  position: relative;  padding-top: 16px;}
.cam_uparrow:before {
  content: "";
  position: absolute;
  bottom: 100%;
  left: 50%;
  margin-left: -15px;
  border: 15px solid transparent;
  border-bottom: 15px solid #475c85;
}

.acadapter_img_list{ width:86%; margin:auto;}
.acadapter_img_list li{ width:49.5%; display:inline-block; text-align:center; vertical-align:top; }
.acadapter_img_list li img{width:80%;}
.acadapter_img_list li span{ display:block; margin-top:10px; font-size:16px; font-weight:700;}
.acadapter_pro{ width:70%; background:#F1F1F1; margin:0 auto; padding:15px;}
.acadapter_pro dt{ text-align:center; margin-bottom:15px; padding:15px; background-color:#FFF; border-radius: 8px;}
.acadapter_pro dt img{ width:60%; max-width:640px}
.acadapter_pro dd{ font-size:16px; line-height:1.6;}
.acadapter_pro dd .acadapter_pro_ttl{ display:block; font-size:18px; font-weight:700;}
.acadapter_pro dd .acadapter_pro_note{ display:block; font-size:14px; margin-top:10px; padding-left:1em; text-indent:-1em;}
.acadapter_pro_spec{ list-style:disc;}
.acadapter_pro_spec li{margin-left:1.5em;}
.cam01 h4.ttl_202302a,.cam04 h4.ttl_202302a{position: relative;font-size: 24px;font-weight:700; margin:0px 0 20px;}
.cam01 h4.ttl_202302a span,.cam04 h4.ttl_202302a span{
text-align: center;
line-height: 1;
display: block;
position: relative;}
.cam01 h4.ttl_202302a:before, .cam01 h4.ttl_202302a::after,.cam04 h4.ttl_202302a:before, .cam04 h4.ttl_202302a::after {
  content: '';
  width: calc(50% - 3.5em);
  height: 1px;
  display: block;
  background: #364563;
  position: absolute;
  top: 50%;
  left: 0;
}
.cam01 h4.ttl_202302a::after,.cam04 h4.ttl_202302a::after{left: auto;right: 0;}
.cam01 .prsc19_order_area#order_fv .product-lineup-wrap{ display: flex;justify-content: space-between; flex-wrap: wrap;}
.cam01 .prsc19_order_area#order_fv .product-lineup-area{ width: 32%;}
.cam01 .prsc19_order_area#order_fv .product-lineup-wrap .product-lineup-item {width: 100%;}
.cam01 .product-lineup-wrap .product-lineup-hanbai {top: 44px;}
.cam02 h3.cam11b_ttl { width: 800px; color: #333;  font-size: 22px; line-height: 1.6; text-align: center; font-weight: 700; padding: 10px 0; margin: 20px auto 15px;}
.cam02 h3.cam11b_ttl .sub_ttl{display:block;}
.cam02 .cam11b_of_togglearea { width: 800px; padding: 0 0 30px; margin: 0 auto; text-align: center;}
.cam11b_of_togglearea.cam11b_2block {width: 535px;}
.cam02 .cam11b_of_togglearea .layout_l {width: 265px;padding: 10px 12px;border-left: 1px solid #666;}
.cam02 .cam11b_of_togglearea .layout_l:last-child {border-right: 1px solid #666;}
.cam02 .cam11b_sub_ttl {font-size: 90%;text-align: center;font-weight: bold;}
.cam02 h5.cam11b_ttl_word, .cam02 h5.cam11b_ttl_excel, .cam02 h5.cam11b_ttl_powerpoint, .cam02 h5.cam11b_ttl_outlook, .cam02 h5.cam11b_ttl_onenote {
    display: inline-block !important;
    margin: 0 auto 10px;
    font-size: 120%;
    font-weight: bold;
    padding: 10px 0px 9px 45px !important;
    background: url(/store/page/pc/campaign/office_2205/img/icn_doc.png) no-repeat left center;
    background-size: 35px;
}
.cam02 h5.cam11b_ttl_excel {background-image: url(/store/page/pc/campaign/office_2205/img/icn_xls.png);}
.cam02 h5.cam11b_ttl_powerpoint { background-image: url(/store/page/pc/campaign/office_2205/img/icn_ppt.png);}
.cam02 h5.cam11b_ttl_outlook { background-image: url(/store/page/pc/campaign/office_2205/img/icn_outlook.png);}
.cam02 h5.cam11b_ttl_onenote { background-image: url(/store/page/pc/campaign/office_2205/img/icn_onenote.png);}
.cam02 .cam11b_of_btn { text-align: center;}
.cam02 .cam11b_of_btn a { display: inline-block; font-size: 16px; line-height: 1; cursor: pointer; color: rgba(0, 0, 0, 0.9);}
.cam02 .cam11b_of_btn a .open_arrow { position: relative; display: inline-block; margin-left: 10px; width: 16px; height: 16px; line-height: 1; background: #364563; -webkit-border-radius: 50%; border-radius: 50%;}
#sections .eccom-contents .cam02 .cam11b_of_btn a .open_arrow:before {position: absolute;content: "";width: 60%;height: 1%;right: 18%;top: 46%;border-top: 1px solid #FFFFFF;}
#sections .eccom-contents .cam02 .cam11b_of_btn a .open_arrow:after {content: "";position: absolute;width: 1%;height: 60%;right: 40%;top: 18%;border-left: 1px solid #FFFFFF;}
#sections .eccom-contents .cam02 .cam11b_of_btn a.open .open_arrow:after, #sections .eccom-contents .cam02 .cam11b_of_btn.open a .open_arrow:after {border-left: none;}
.cam02 .cam11b_of_acdnarea { display: none; box-sizing: border-box; width: 800px; padding: 10px 0 30px; margin: 0 auto 0;}
.cam02 .cam11b_of_acdnbox {position: relative;width: 760px;padding: 20px 10px; background-color: #f5f5f5;}
.cam02 .cam11b_of_acdnbox.active { display: block;}
.cam02 .cam11b_of_acdnbox:before { content: ""; position: absolute; top: -30px; left: 50%; margin-left: -15px; border: 15px solid transparent; border-bottom: 15px solid #f5f5f5;}
.cam02 .cam11b_of_acdnbox:first-child:before {left: 16%;}
.cam02 .cam11b_of_acdnbox:nth-child(3n):before { left: 82.5%;}
.cam02 .cam11b_2block .cam11b_of_acdnbox:first-child:before { left: 33%;}
.cam02 .cam11b_2block .cam11b_of_acdnbox:nth-child(2):before { left: 66%;}
.cam02 .cam11b_of_i_text { width: 410px; float: left; margin-left: 10px;}
.cam02 .cam11b_of_i_thumb { width: 298px; text-align: center; float: right; margin-right: 10px;}
.cam02 .cam11b_of_intro .cam11b_feature_title { font-size: 18px; line-height: 1.3; margin-bottom: 15px;}
.cam02 .cam11b_of_intro:after,.cam02 .cam11b_cf:after {content: "";clear: both;height: 0;display: block;visibility: hidden;}
.cam02 .cam11b_of_intro dl { display: inline-block; width: 32%; vertical-align: top;}
.cam02 .cam11b_of_intro dl dt { font-size: 18px; font-weight: bold; padding: 15px 10px 0;}
.cam02 .cam11b_of_intro dl dd { font-size: 16px; padding: 15px 10px;}
.cam02 .cam11b_bk h4.cam11b_ttl { font-size: 16px;font-weight: 700;margin: 15px 0 15px -15px;padding: 0 0 30px !important;}
.cam02 .cam11b_bk h4.cam11b_ttl span { position: absolute; display: inline-block; padding: 8px 50px 5px 15px !important; background: #DEE3ED;}
.cam02 .cam11b_bk h4.cam11b_ttl span:after { content: ""; position: absolute; top: 0; right: 0; width: 0; height: 0; border-style: solid; border-color: transparent transparent #f5f5f5 #DEE3ED; border-width: 0 0 39px 21px;}
.cam02 h3.cam11b_mainttl { font-size: 160%; line-height: 1.6; font-weight: 700; text-align: center; padding: 10px 0;}
.cam02 .cam11b_bk h5.cam11b_ttl { font-size: 16px; font-weight: bold; background: none; margin: 0 auto 15px; padding-left: 10px; border-left: 4px solid #9CABC9;}
.cam02 .cam11b_box.cam11b_bk .cam11b_box { width: 750px;margin-right: auto; margin-left: auto;}
.cam02 .cam11b_box.cam11b_bk .cam11b_box.box2 .layout_l, .cam02 .cam11b_box.cam11b_bk .cam11b_box.box2 .layout_r {width: 340px;border-right: none;padding: 0px 15px 10px;margin-top: 0px;}
.cam02 .cam11b_box .layout_l.box2-1 img.cam11b_w100, .cam02 .cam11b_box .layout_r.box2-1 img.cam11b_w100 { width: 100%;}
.coupon_area dl dt .hukidasi {position: relative;display: block; width:8em; margin:0 auto 1em; padding: 7px 10px; font-size:120%; color: #FFF; background-color:#5973a6; box-sizing: border-box;border-radius: 6px;}
.coupon_area dl dt .hukidasi:before {  content: ""; position: absolute; bottom: -24px; left: 50%; margin-left: -15px; border:12px solid transparent;  border-top: 12px solid #5973a6; z-index: 2;}
.cam03 .coupon_area ul.attention{ width:440px; margin-left:auto; margin-right:auto}
/* spn */
@media only screen and (max-width:640px) {
#campaign_cont ul.target li{border-right: none;}
#wrapper #body #campaign_cont ul.target li a{font-size: 13px!important;}
#wrapper #body #campaign_cont ul.target:last-child li a{ padding:10px 5px ;}
.cam_hukidasi { font-size: 18px;}
#campaign_cont .sale_h2{ font-size:26px;}
#campaign_cont .cam11b_980 { width: auto; margin: auto;}
#campaign_cont .cam11b_box, #campaign_cont .cam11b_box.cam11b_bk {width: 90%;margin-right: auto;margin-left: auto;}
/* */
.for_sp_mt10{ display:block; padding-top:10px;}
.ssd_customize{
	width:100%;
}
.ssd_customize.ssd_line{
	width:94%;
	margin-left:3%;
}

.ssd_off{
	font-size:116%;
	width:88%;
	margin:0px auto 30px ;
	padding:1em 0;
	border:1px solid #666;
}
.ssd_off:before { background:none; }
.ssd_hikakubox{
	margin:0 3%;
	padding:1em 0;
	}
.block .ssd_hikakubox p{
	margin-left:2%;
	margin-right:2%;
}
.acadapter_img_list{ width:100%;}
.acadapter_img_list li{ width:49.3%;}
.acadapter_img_list li span{ font-weight:300;}
.acadapter_pro{ width:90%; }
.cam01 h4.ttl_202302a,.cam04 h4.ttl_202302a{margin:40px 0 20px;}
.cam01 .prsc19_order_area#order_fv .product-lineup-wrap{ display: block;}
.cam01 .prsc19_order_area#order_fv .product-lineup-area{ width: 100%;}
.cam02 h3.cam11b_ttl { width: 94%; margin: 0 auto 20px !important; padding-top: 25px;}
.cam02 h5.cam11b_ttl_word, .cam02 h5.cam11b_ttl_excel, .cam02 h5.cam11b_ttl_powerpoint, .cam02 h5.cam11b_ttl_outlook, .cam02 h5.cam11b_ttl_onenote {font-size: 140%;margin: 0.5em 2%;padding: 1em 0px 1em 3.5em !important; background-size: 3em; border: none;}
#campaign_cont .cam02 div.divbox div.layout_l { float: none;}
.cam02 .cam11b_of_togglearea, .cam02 .cam11b_of_togglearea.cam11b_2block { width: 90%; padding: 0;}
.cam02 .cam11b_of_togglearea .layout_l, .cam02 .cam11b_of_togglearea .layout_l:last-child {width: 80%;display: block;margin: 0 9% 10px;padding: 10px 0 20px;border: none;}
.cam02 .cam11b_sub_ttl { font-size: 110%;}
.cam02 .cam11b_of_acdnarea { display: block; width: 100%; margin-top: -15px; margin-bottom: 25px; padding-bottom: 25px; border-bottom: 1px solid #666;}
.cam02 .cam11b_of_acdnbox { display: none; width: 90%; font-size: 120%; margin: 30px auto 2%; padding: 20px 3%;}
.cam02 .cam11b_of_acdnbox:before, .cam02 .cam11b_of_acdnbox:first-child:before, .cam02 .cam11b_of_acdnbox:nth-child(3n):before, .cam02 .cam11b_2block .cam11b_of_acdnbox:first-child:before, .cam02 .cam11b_2block .cam11b_of_acdnbox:nth-child(2):before { left: 50%; margin-left: -15px;}
.cam02 .cam11b_of_i_text { width: 100%; float: none; margin-left: 0;}
.cam02 .cam11b_of_intro .cam11b_feature_title { color: #000;}
.cam02 .cam11b_of_i_thumb { width: 100%; float: none; margin-top: 15px; margin-right: 0;}
.cam02 .cam11b_of_intro dl { display: block; width: 90%; margin: 0 auto; text-align: left;}
.cam02 .cam11b_of_bnr { width: 90%; margin: 0 5%;}
.cam02 .cam11b_bk h4.cam11b_ttl { padding: 0.5em 0 1em !important; border: none;}
.cam02 .cam11b_bk h4.cam11b_ttl span:after {border-width: 0 0 2em 1.2em;}
.cam02 .cam11b_box.cam11b_bk .cam11b_box { width: 90%; padding: 0 !important;}
#campaign_cont .cam02 .cam11b_box.cam11b_bk .cam11b_box.box2 .layout_l, #campaign_cont .cam02 .cam11b_box.cam11b_bk .cam11b_box.box2 .layout_r { width: 100%; margin: 0 auto 1.5em; padding: 0em;border-right: none;  border-bottom: none; float: none; display: block;}
	#campaign_cont .coupon_area dl dt p.hukidasi { margin:0 auto 1em;}
	.cam03 .coupon_area ul.attention{ width: auto;margin: 0 15px 0.5em;}
}