@charset "UTF-8"; @import url('https://fonts.googleapis.com/css?family=Dancing+Script'); body{background: inherit;} .font-min{font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "MS P明朝", "MS 明朝", serif;} .en01{font-family: 'Dancing Script', cursive;} .mt-xxs{margin-top: 8px !important;}.mb-xxs{margin-bottom: 8px !important;}.ml-xxs{margin-left: 8px !important;}.mr-xxs{margin-right: 8px !important;} .mt-xs{margin-top: 12px !important;}.mb-xs{margin-bottom: 12px !important;}.ml-xs{margin-left: 12px !important;}.mr-xs{margin-right: 12px !important;} .mt-ss{margin-top: 18px !important;}.mb-ss{margin-bottom: 18px !important;}.ml-ss{margin-left: 18px !important;}.mr-ss{margin-right: 18px !important;} .mt-s{margin-top: 28px !important;}.mb-s{margin-bottom: 28px !important;}.ml-s{margin-left: 28px !important;}.mr-s{margin-right: 28px !important;} .mt-m{margin-top: 46px !important;}.mb-m{margin-bottom: 46px !important;}.ml-m{margin-left: 46px !important;}.mr-m{margin-right: 46px !important;} .mt-l{margin-top: 65px !important;}.mb-l{margin-bottom: 65px !important;}.ml-l{margin-left: 65px !important;}.mr-l{margin-right: 65px !important;} .pt-xxs{padding-top: 8px !important;}.pb-xxs{padding-bottom: 8px !important;}.pl-xxs{padding-left: 8px !important;}.pr-xxs{padding-right: 8px !important;} .pt-xs{padding-top: 12px !important;}.pb-xs{padding-bottom: 12px !important;}.pl-xs{padding-left: 12px !important;}.pr-xs{padding-right: 12px !important;} .pt-ss{padding-top: 18px !important;}.pb-ss{padding-bottom: 18px !important;}.pl-ss{padding-left: 18px !important;}.pr-ss{padding-right: 18px !important;} .pt-s{padding-top: 28px !important;}.pb-s{padding-bottom: 28px !important;}.pl-s{padding-left: 28px !important;}.pr-s{padding-right: 28px !important;} .pt-m{padding-top: 46px !important;}.pb-m{padding-bottom: 46px !important;}.pl-m{padding-left: 46px !important;}.pr-m{padding-right: 46px !important;} .pt-l{padding-top: 65px !important;}.pb-l{padding-bottom: 65px !important;}.pl-l{padding-left: 65px !important;}.pr-l{padding-right: 65px !important;} .mod-freeHTMLinner{max-width: 1052px; margin-left: auto; margin-right: auto;} .printermag-bg{background: url(/~/media/cojp/product/printer/home/magazine/img/printermag-printermag-bg);} .st-freeContents{background: url(/~/media/cojp/product/printer/home/magazine/img/printermag-printermag-bg);} .pankuzu{background: #fff; border-bottom: 1px solid #ddd; padding: 12px 0;} .pankuzu .inner{max-width: 1052px; margin-left: auto; margin-right: auto;} .pankuzu .inner li {display: inline; line-height: 1.8em; font-size: 0.9em;} .pankuzu .inner li + li{border-left: 1px solid; margin-left: 14px; padding-left: 14px;} .pankuzu .inner li a{text-decoration: underline; color: #a5365c;} .tags{display: block; margin: 8px 0;} .tags i{font-style: normal; display: inline-block; font-size: 0.8em; padding: 2px 8px;} .overflow-h{overflow: hidden;} .float-l{float: left;} .float-r{float: right;} .mag-2clm{position: relative;} .mag-2clm > .float-l{width: 700px;} .mag-2clm > .float-r{width: 334px;} .clm-2-list{margin:0 -2%;} .clm-2-list li{float: left; width: 46%; margin: 2%;} .clm-3-list{margin:0 -1%;} .clm-3-list li{float: left; width: 31.3%; margin: 1%;} /* Category style */ .cate-life{background: #78a767 !important; color: #fff !important;} .cate-business{background: #5b78b3 !important; color: #fff !important;} .cate-hobby{background: #7ca7c8 !important; color: #fff !important;} .cate-education{background: #dba742 !important; color: #fff !important;} .cate-use{background: #cb5f50 !important; color: #fff !important;} .hrstyle01{border-bottom: none; border-top: 2px solid #ddd; margin: 0;} .boxstyle01{padding: 30px; margin: 4px; box-shadow: 0 0 8px rgba(0,0,0,0.1); background: #fff; position: relative;} .boxstyle01:before{content: ''; display: inline-block; position: absolute; right: -4px; top: -4px; width: 38px; height: 38px; background: url(/~/media/cojp/product/printer/home/magazine/img/printermag-box01top) no-repeat;} .boxstyle01:after{content: ''; display: inline-block; position: absolute; left: -4px; bottom: -4px; width: 38px; height: 38px; background: url(/~/media/cojp/product/printer/home/magazine/img/printermag-box01btm) no-repeat;} .magazinelist li a{box-sizing: border-box; display: block; border: 1px solid #ddd; height: 100%; background: #fff;} .magazinelist li a p{padding: 0 10px 10px;} .ttlstyle01 {text-align: center; font-size: 1.6em;} .ttlstyle01 small{display: block; margin-bottom: 12px; font-size: 0.9em;} .ttlstyle01 em{position: relative; padding: 0 10px; z-index: 1;} .ttlstyle01 em:after{position: absolute; width:100%; height: 0.7em; content: ''; display: block; bottom: -4px; left: 0; z-index: -1;} .newarea .ttlstyle01 em:after{background: #f8e7e7;} .pickuparea .ttlstyle01 em:after{background: #fbecd7;} .relationarea .ttlstyle01 em:after{background: #e2f0fa;} .newarea .ttlstyle01 small{color: #e25061;} .pickuparea .ttlstyle01 small{color: #e4992f;} .relationarea .ttlstyle01 small{color: #6a93b1;} .btn a{display: block;} .btnstyle01 a{background: #303030; color: #fff; text-align: center; padding:12px 10px 12px 20px; border-radius: 6px; font-size: 1.18em; position: relative; max-width: 700px; margin-left: auto; margin-right: auto;} .btnstyle01.pnk a{background: #e74d80;} .btn-more a:before{content: '▶︎'; font-size: 0.5em; position: absolute; left: 12px;} .btn-back a:before{content: '◀︎'; font-size: 0.5em; position: absolute; left: 12px;} .page-headarea{text-align: center; background: url(/~/media/cojp/product/printer/home/magazine/img/printermag-box02l) left 14% center no-repeat,url(/~/media/cojp/product/printer/home/magazine/img/printermag-box02r) right 14% center no-repeat; background-size: contain;} .rankingnav.fixed{position: fixed; top: 20px; left: 50%; margin-left: 192px;} .rankingnav.absolute{position: absolute; right: 0; bottom: 0;} .rankingnav section{background: #264138; padding: 16px;} .rankingnav h3{color: #fff; text-align: center;} .rankingnav h3 img{width: 80%;} .rankingnav ul li{ background: url(/~/media/cojp/product/printer/home/magazine/img/printermag-ranking-tate) left repeat-y, url(/~/media/cojp/product/printer/home/magazine/img/printermag-ranking-tate) right repeat-y, url(/~/media/cojp/product/printer/home/magazine/img/printermag-ranking-yoko) top repeat-x, url(/~/media/cojp/product/printer/home/magazine/img/printermag-ranking-yoko) bottom repeat-x, #fff;} .rankingnav ul li + li{margin-top: 14px;} .rankingnav ul li a{display: table; padding:10px; position: relative;} .rankingnav ul li a img{display: table-cell; vertical-align: middle; width: 115px;} .rankingnav ul li a p{display: table-cell; vertical-align: middle; font-size: 0.9em; padding-left:10px;} .rankingnav ul li a .tags{margin: 0 0 5px;} .rankingnav ul li a .tags i{padding: 0 4px;} .rankingnav ul li a:hover{opacity: 1;} .rankingnav ul li a:hover p{text-decoration: underline;} .rankingnav ul li:nth-child(1) a:after{content: ''; position: absolute; left: -10px; top: -8px; width: 40px; height: 40px; display: inline-block; background: url(/~/media/cojp/product/printer/home/magazine/img/printermag-icon-ranking1) no-repeat; background-size: 100%;} .rankingnav ul li:nth-child(2) a:after{content: ''; position: absolute; left: -10px; top: -8px; width: 40px; height: 40px; display: inline-block; background: url(/~/media/cojp/product/printer/home/magazine/img/printermag-icon-ranking2) no-repeat; background-size: 100%;} .rankingnav ul li:nth-child(3) a:after{content: ''; position: absolute; left: -10px; top: -8px; width: 40px; height: 40px; display: inline-block; background: url(/~/media/cojp/product/printer/home/magazine/img/printermag-icon-ranking3) no-repeat; background-size: 100%;} .rankingnav ul li:nth-child(4) a:after{content: ''; position: absolute; left: -8px; top: -8px; width: 28px; height: 28px; display: inline-block; background: url(/~/media/cojp/product/printer/home/magazine/img/printermag-icon-ranking4) no-repeat; background-size: 100%;} .rankingnav ul li:nth-child(5) a:after{content: ''; position: absolute; left: -8px; top: -8px; width: 28px; height: 28px; display: inline-block; background: url(/~/media/cojp/product/printer/home/magazine/img/printermag-icon-ranking5) no-repeat; background-size: 100%;} .rankingnav ul li:nth-child(6) a:after{content: ''; position: absolute; left: -8px; top: -8px; width: 28px; height: 28px; display: inline-block; background: url(/~/media/cojp/product/printer/home/magazine/img/printermag-icon-ranking6) no-repeat; background-size: 100%;} /* slider */ .slider-container {display: none; position: relative;} .slider-container.initialized {display:block;} .slider {overflow: hidden;} .slider li a{display: block; position: relative;} .slider li a:hover{opacity: 1;} .slider li a .tags{position: absolute; top: 0; left: 0; margin-top: 0; z-index: 1;} .slider li a .tags i{font-size: 1em; padding: 4px 10px;} .slider li a p{position: absolute; background: rgba(0,0,0,.7); color: #fff; bottom: 0; padding: 10px; text-align: left;} .slider-arrow { position: absolute; top: 0; width: 60px; background: #000; height: 100%; color: #fff; line-height: 36px; font-size: 28px; cursor: pointer; z-index: 10; /* 重要 */ } .slider-prev {left: 0; background: -moz-linear-gradient(left, rgba(0,0,0,0.4) 0%, rgba(255,255,255,0) 100%); background: -webkit-linear-gradient(left, rgba(0,0,0,0.4) 0%,rgba(255,255,255,0) 100%); background: linear-gradient(to right, rgba(0,0,0,0.4) 0%,rgba(255,255,255,0) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#66000000', endColorstr='#00ffffff',GradientType=1 ); } .slider-next {right: 0; background: -moz-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(0,0,0,0.4) 100%); background: -webkit-linear-gradient(left, rgba(255,255,255,0) 0%,rgba(0,0,0,0.4) 100%); background: linear-gradient(to right, rgba(255,255,255,0) 0%,rgba(0,0,0,0.4) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#66000000',GradientType=1 ); } .slider-arrow i{display: block; height: 100%; line-height: 100%; position: relative;} .slider-arrow i img{position: absolute; top: 50%; width: 68px; margin-top: -40px;} .slider-prev i img{left: -20px;} .slider-next i img{right: -20px;} .cate-nav ul {overflow: hidden; margin: -0.5%;} .cate-nav ul li{display: inline-block; width: 19%; float: left; margin:0 0.5%;} .cate-nav ul li a{display: block; border-radius: 4px; font-size: 1.18em; text-align: center; padding:12px 6px;} .cate-nav ul li a i{display: inline-block; width: 1.6em; margin-right: 7px; margin-left: -1.4em;} .cate-nav ul li a i img{width: 100%; vertical-align: middle;} .cate-nav ul li a span{vertical-align: middle;} .cate-nav ul li.current a{position: relative; pointer-events:none;} .cate-nav ul li.current a:after{content: ''; position: absolute; display: block; width: 96%; height: 84%; border: 2px solid #ffffff; top: 8%; left: 2%; box-sizing: border-box; border-radius: 3px;} .cate-ttl p{display: block; font-size: 1.35em; text-align: center; padding:12px 6px;} /* detail style */ .kiji { padding: 32px 0; position: relative;} .kiji a, .mv_kiji a {color: #e74d80;} .mv_kiji { padding: 0 0 32px; position: relative;} .kiji:before { content: ""; display: block; width: 80px; border-bottom: 1px solid #e74d80; position: absolute; top: 0; left: 0px;} .kiji .tit { font-size: 20px; line-height: 160%; color: #24a60a; padding-left: 34px; background: url("/~/media/cojp/product/printer/home/magazine/img/icon_kiji_tit") no-repeat left top; min-height: 31px;} .mv {position: relative; padding: 0 0 32px;} .mv .icon { position: absolute; top: -82px; left: 0px;} .mv .icon p { position: absolute; top: 18px; left: 0px; width: 100%; color: #ffffff; text-align: center; font-size: 14px; font-weight: bold; line-height: 24px;} .mv .icon p span { font-size: 24px; line-height: 24px;} .mv .tit { font-size: 1.6em; line-height: 160%; min-height: 31px;} .mv .tit .tags{font-size: 0.7em; line-height: 1.4em;} .mv .txt { margin-top: 35px; font-size: 14px; line-height: 150%; color: #000000;} .kiji_img { margin-top: 20px; text-align: center;} .kiji_img .img { max-width: 100%; height: auto;} /* ABS修正 2018/2/15 */ /*.mv .sns { height: 24px; margin-top: 20px; overflow: hidden;}*/ .mv .sns { margin-top: 20px; overflow: hidden;} .mv .sns img{margin-bottom:5px;} /* ABS修正 2018/2/15 終わり */ .mv .sns ul li { float:left; margin-left: 5px;} .kiji .subtit { font-size: 14px; line-height: 150%; color: #000000; margin-top: 30px; padding-bottom: 15px; font-weight: bold;} .kiji .txt { margin-top: 35px; font-size: 14px; line-height: 150%; color: #000000;} .kiji .txt .right { color: #e74d80; float: right;} .kiji ul.list{font-size: 14px;} .kiji ul.list li{ list-style:disc; padding:0 0 0 0px; margin:0 0 0 10px; text-indent:5px;} .mar_t30 {margin-top:30px;} .kiji .txt_2 { font-size: 14px; line-height: 150%; color: #000000;} .kiji .txt_3 { font-size: 14px; line-height: 150%; color: #3306CD; margin-top: 40px; font-weight: bold;} .kiji .txt_4 { font-size: 14px; line-height: 150%; margin-top: 30px; font-weight: bold;} .kiji .txt_5 { margin-bottom: 35px; font-size: 14px; line-height: 150%; background-color:#B9E7F8; padding:10px;} .kiji .m_list td{ border-bottom:1px solid #999999; line-height:200%; font-size: 14px;} .bold{font-weight:bold;} .kiji .subtit_2 { font-size: 14px; line-height: 120%; color: #000000; margin-top: 35px; font-weight: bold;} .kiji .txt .txt_right { float: right;} .onlysp{display: none;} @media screen and (max-width: 640px) { a:hover{opacity: 1;} .onlypc{display: none;} .onlysp{display: block;} .inner{width: 96%; margin: 0 2%;} .mt-xxs{margin-top: 4px !important;}.mb-xxs{margin-bottom: 4px !important;}.ml-xxs{margin-left: 4px !important;}.mr-xxs{margin-right: 4px !important;} .mt-xs{margin-top: 8px !important;}.mb-xs{margin-bottom: 8px !important;}.ml-xs{margin-left: 8px !important;}.mr-xs{margin-right: 8px !important;} .mt-ss{margin-top: 10px !important;}.mb-ss{margin-bottom: 10px !important;}.ml-ss{margin-left: 10px !important;}.mr-ss{margin-right: 10px !important;} .mt-s{margin-top: 22px !important;}.mb-s{margin-bottom: 22px !important;}.ml-s{margin-left: 22px !important;}.mr-s{margin-right: 22px !important;} .mt-m{margin-top: 28px !important;}.mb-m{margin-bottom: 28px !important;}.ml-m{margin-left: 28px !important;}.mr-m{margin-right: 28px !important;} .mt-l{margin-top: 48px !important;}.mb-l{margin-bottom: 48px !important;}.ml-l{margin-left: 48px !important;}.mr-l{margin-right: 48px !important;} .pt-xxs{padding-top: 4px !important;}.pb-xxs{padding-bottom: 4px !important;}.pl-xxs{padding-left: 4px !important;}.pr-xxs{padding-right: 4px !important;} .pt-xs{padding-top: 8px !important;}.pb-xs{padding-bottom: 8px !important;}.pl-xs{padding-left: 8px !important;}.pr-xs{padding-right: 8px !important;} .pt-ss{padding-top: 10px !important;}.pb-ss{padding-bottom: 10px !important;}.pl-ss{padding-left: 10px !important;}.pr-ss{padding-right: 10px !important;} .pt-s{padding-top: 22px !important;}.pb-s{padding-bottom: 22px !important;}.pl-s{padding-left: 22px !important;}.pr-s{padding-right: 22px !important;} .pt-m{padding-top: 28px !important;}.pb-m{padding-bottom: 28px !important;}.pl-m{padding-left: 28px !important;}.pr-m{padding-right: 28px !important;} .pt-l{padding-top: 48px !important;}.pb-l{padding-bottom: 48px !important;}.pl-l{padding-left: 48px !important;}.pr-l{padding-right: 48px !important;} .page-headarea{background: url(/~/media/cojp/product/printer/home/magazine/img/printermag-box02l) left 10px top no-repeat,url(/~/media/cojp/product/printer/home/magazine/img/printermag-box02r) right 10px top no-repeat; background-size: 20%;} .page-headarea img{width: 164px; margin-bottom: 12px;} .cate-nav ul{margin: 1%;} .cate-nav ul li{width: 48%; margin: 1%;} .mag-2clm > .float-l{float: none; width: 96%; margin: 0 2%;} .mag-2clm > .float-r{float: none; width: 100%; margin-top: 22px;} .clm-2-list{margin: 0;} .clm-2-list li{float: none; width: 100%; margin: 0;} .clm-2-list li + li{margin-top: 14px;} .clm-3-list{margin: 0;} .clm-3-list li{float: none; width: 100%; margin: 0;} .clm-3-list li + li{margin-top: -1px;} .clm-3-list li a{display: table; width: 100%;padding:10px; position: relative;} .clm-3-list li a img{display: table-cell; vertical-align: middle; width: 115px;} .clm-3-list li a p{display: table-cell; vertical-align: middle; font-size: 0.9em; padding-left:10px;} .clm-3-list li a .tags{margin: 0 0 5px;} .clm-3-list li a .tags i{padding: 0 4px;} .clm-3-list li a:hover{opacity: 1;} .printermag-cate section{width: 86%; margin: 0 3%} /* sp menu */ #contents_wrapper { position: relative; overflow: hidden; transition: all.3s ease; background: #fff;} #contents_wrapper.open { -webkit-transform: translateX(80px); transform: translateX(80px);} /* ABS修正 2018/2/14 */ /* #contents_hd .bg { display: table; width: 100%; background: #433b31; background-size: 100% auto; padding: 6px 0 ;}*/ #contents_hd .bg { display: table; width: 100%; background: #433b31; background-size: 100% auto; padding: 6px 0 ;height: 37px;} /* ABS修正 2018/2/14 終わり*/ #contents_hd #menu { vertical-align: middle; display: table-cell; width: 50px;} #page_01 {position: relative;} #page_01.fix{position: fixed; width: 100%; top: 0; left: 0; z-index: 100;} #menu_btn { position: absolute; top: 0; left: 0; width: 50px; height: 50px; opacity: 1;} #menu_btn.none {opacity: 0;} #menu_btn_float { background: #433b31; position: fixed; width: 50px; height: 50px; z-index: 100; opacity: 1; display: block; top: 44px;} #menu_btn_float.fixed_menu { transition: all.3s ease; background: #433b31; background-size: 50px 50px; top: 0px; opacity: 1; display: block;} #menu_btn_float.open {top: 44px;} #menu_btn span, #menu_btn_float span { background: #ffffff; width: 20px; height: 3px; position: absolute; left: 15px; display: block; -webkit-transition: all 0.2s ease; transition: all 0.2s ease;} #menu_btn span:nth-child(1),#menu_btn_float span:nth-child(1) {top: 15px;} #menu_btn span:nth-child(2),#menu_btn_float span:nth-child(2) {top: 23px;} #menu_btn span:nth-child(3),#menu_btn_float span:nth-child(3) {top: 31px;} #menu_btn.open span:nth-child(1), #menu_btn_float.open span:nth-child(1) { top: 23px; -webkit-transform: rotate(45deg) translateX(0px) translateY(0px); transform: rotate(45deg) translateX(0px) translateY(0px);} #menu_btn.open span:nth-child(2), #menu_btn_float.open span:nth-child(2) {opacity: 0;} #menu_btn.open span:nth-child(3), #menu_btn_float.open span:nth-child(3) { top: 23px; -webkit-transform: rotate(-45deg) translateX(0px) translateY(0px); transform: rotate(-45deg) translateX(0px) translateY(0px);} #contents_hd h1 { vertical-align: middle; display: table-cell; width: 53.4375%; text-align: center;} #contents_hd #login { vertical-align: middle; display: table-cell; width: 50px; text-align: right;} #contents_hd #login a { box-sizing: border-box; padding: 20px 18px;} #slide_menu {display: none; position: absolute; top: 49px; left: 0; overflow-x: hidden; overflow-y: scroll; -webkit-overflow-scrolling: touch; transition: all .3s ease; width: 100%; background: #302c25; z-index: 100;} #slide_menu ul{font-size: 0;} #slide_menu ul li{display: inline-block; width: 25%;} #slide_menu.open {display: block;} #contents_wrapper { position: relative; overflow: hidden; transition: all.3s ease; background: #fff;} #contents_wrapper.open { -webkit-transform: translateX(80px); transform: translateX(80px);} .boxstyle01{padding: 26px 4%;} .boxstyle01:before{content: ''; display: inline-block; position: absolute; right: -4px; top: -4px; width: 28px; height: 28px; background: url(/~/media/cojp/product/printer/home/magazine/img/printermag-box01top) no-repeat;} .boxstyle01:after{content: '';display: inline-block;position: absolute;left: -4px;bottom: -4px;width: 28px;height: 28px;background: url(/~/media/cojp/product/printer/home/magazine/img/printermag-box01btm) no-repeat;} .slider li a:hover{opacity: 1;} .rankingnav.fixed{position: inherit; top: inherit; left: inherit; margin-left: 0;} .rankingnav.absolute{position: inherit; right: inherit; bottom: inherit;} .rankingnav ul li a:hover p{text-decoration: none;} } /* ABS追加 2018/2/13 */ .video iframe{ width:560px; height:315px; } @media screen and (max-width: 640px) { .video{ position:relative; width:100%; padding-top:56.25%;} .video iframe{ position:absolute; top:0; right:0; width:100%; height:100%; } } .insta{ width:658px; margin:0 auto; } @media screen and (max-width: 640px) { .insta{ width:100%; } } div[id*="___plusone"] { vertical-align:top !important; } #snsPart iframe{ vertical-align:top; } /* ABS追加 終わり */