#mainvisual {
margin-top: 0;
margin-bottom: 0;
padding: 6.5em 0;
background: url(/saws/images/bg-main-saws.png) no-repeat;
background-size: cover;
}

#mainvisual img {
max-width: 450px;
height: auto;
}

#mainvisual h3 {
margin-bottom: 3em;
}

.mainvisual-socialbtns {
text-align: center;
}

.mainvisual-socialbtns .socialbtn {
display: inline-block;
margin: 0 5px;
vertical-align: bottom;
}

.mainvisual-socialbtns #facebook_like {
position: relative;
top: -2px;
}

#content h1.section-ttl {
padding-top: 0;
font-family: "Noto Sans Japanese";
font-size: 3em;
font-weight: 100;
line-height: 1.3;
}

.lead {
margin-top: -1em;
margin-bottom: 3em;
text-align: center;
}

.saws-entries img {
max-width: 100%;
}

.saws-entries-recent {
margin-bottom: 2em;
}

.saws-entries ul li {
width: 31%;
margin: 0 3.5% 30px 0;
float: left;
}

.saws-entries ul li:nth-child(3n) {
margin-right: 0;
}

.saws-entries ul li a {
position: relative;
display: block;
background: #f1f1f1;
color: #111;
box-shadow: 0px 2px 2px rgba(0,0,0,0.12);
}

.saws-entries ul li a .label-media {
position: absolute;
top: 10px;
left: -10px;
display: inline-block;
padding: 5px 12px;
background: #666;
color: #fff;
font-size: 15px;
line-height: 1.3;
}

.saws-entries ul li a:hover {
background: #ededed;
text-decoration: none;
box-shadow: 0px 2px 2px rgba(0,0,0,0.2);
}

.section-grey .saws-entries ul li a {
background: #fff;
}

.section-grey .saws-entries ul li a:hover {
background: #f9f9f9;
}

.saws-entries .entrydetail {
padding: 5px 10px 10px 10px;
}

.saws-entries .entrydate {
font-size: 86%;
}

.saws-entries-recent {
font-size: 121%;
}

.saws-entries-recent a {
position: relative;
display: block;
height: 360px;
}

.saws-entries-recent a .label {
position: absolute;
top: 10px;
right: -10px;
display: inline-block;
padding: 5px 12px;
background: #bec217;
color: #fff;
font-size: 15px;
line-height: 1.3;
}

.saws-entries-recent a .label-media {
position: absolute;
top: 10px;
left: -10px;
display: inline-block;
padding: 5px 12px;
background: #666;
color: #fff;
font-size: 15px;
line-height: 1.3;
}

.saws-entries-recent figure {
position: relative;
height: 360px;
overflow: hidden;
}

.saws-entries-recent figure img {
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}

.saws-entries-recent .entrydetail {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
padding: 20px;
background: rgba(0,0,0,0.8);
background: linear-gradient(rgba(0,0,0,0), rgba(0,0,0,0.85));
background: -webkit-linear-gradient(top, rgba(0,0,0,0), rgba(0,0,0,0.85));
background-image: linear-gradient(rgba(0,0,0,0) 0px, rgba(0,0,0,0.85) 100%);
box-sizing: border-box;
}

.saws-entries-recent a {
color: #fff;
}

.saws-entries ul li figure {
display: block;
margin-bottom: 0.5em;
}

.entries-list {
text-align: center;
}

.entries-list a {
width: 33%;
padding-left: 0;
padding-right: 0;
}

.saws-top-about-text {
margin-bottom: 3em;
}

.saws-top-about-text p {
margin-bottom: 1em;
}

.saws-top-about-message {
position: relative;
padding: 30px 20px;
background: #ededed;
}

.saws-top-about-message:after {
position: absolute;
top: -25px;
left: 20px;
content: "\f10d";
font-family: FontAwesome;
font-size: 45px;
}

.saws-top-about-message-title {
margin-bottom: 15px;
text-align: center;
font-size: 170%;
}

.saws-top-about-message-to {
text-align: right;
font-style: italic;
}

.saws-feature .icon {
font-size: 80px;
text-align: center;
}

.saws-feature .title {
margin-bottom: 0.5em;
font-size: 150%;
line-height: 1.3;
text-align: center;
}

.saws-feature .text {
text-align: center;
}

#saws-top-thought {
background: #60bceb;
color: #fff;
}

#saws-top-work {
background: #004c9a;
color: #fff;
}

.content-saws section {
padding: 3em 1em 4em;
margin-bottom: 0;
box-sizing: border-box;
}

section .saws-feature:last-of-type {
margin-bottom: 0;
}

#saws-top-thought p.lead {
margin-bottom: 1em;
}

.saws-feature-first {
padding-bottom: 4em;
margin-bottom: 3em;
border-bottom: solid 1px #fff;
}

.section-grey {
background: #f1f1f1;
}

.section-contact {
background: #bec217;
color: #fff;
}

.section-contact .lead {
margin-bottom: 2em;
}

.section-follow .col-group {
margin-bottom: 0;
}

.section-follow {
background: #2a55a2;
color: #fff;
}

.saws-vpn-top-box {
margin-bottom: 3em;
}

.saws-vpn-top-boxies .saws-vpn-top-box:last-of-type {
margin-bottom: 0;
}

.saws-vpn-top-box .image-left {
width:  46%;
float: left;
}

.saws-vpn-top-box .image-right {
float: right;
width: 46%;
}

.saws-vpn-top-box .image img {
padding: 10px;
max-width: 100%;
border: solid 1px #e1e1e1;
box-sizing: border-box;
background: #fff;
}

.saws-vpn-top-box .detail-left {
width:  50%;
float: left;
}

.saws-vpn-top-box .detail-right {
width:  50%;
float: right;
}

.saws-vpn-recommend .text {
width: 650px;
float: left;
}

.saws-vpn-recommend .product-class {
width: 303px;
float: right;
}

.saws-vpn-recommend .product-class img {
padding: 10px;
max-width: 100%;
border: solid 1px #e1e1e1;
box-sizing: border-box;
background: #fff;
}

#content .saws-vpn-recommend h3 {
font-weight: bold;
margin-bottom: 7px;
}

#content .saws-vpn-recommend h4 {
  margin-bottom: 10px;
font-size: 20px;
font-weight: bold;
margin-bottom: 7px;
}

.saws-vpn-recommend .star {
margin-bottom: 1em;
color: #EB7000;
font-size: 121%;
}

.saws-vpn-recommend .price strong {
color: #EB7000;
font-size: 135%;
font-weight: bold;
}

.saws-vpn-recommend ul {
margin-bottom: 1em;
}

.saws-vpn-recommend ul li {
padding-left: 0.8em;
margin-bottom: 0.3rem;
background: url("/share/images/icon_ul_nolink.gif") no-repeat 0 0.4rem;
}

.saws-vpn-section p {
margin-bottom: 1em;
}

.saws-vpn-section p.caption {
font-size: 79%;
}

.saws-vpn-section p.mb30 {
margin-bottom: 30px;
}

#content section.saws-vpn-section {
margin-bottom: 4em;
}

#mainvisual-saws-vpn {
position: relative;
width: 100%;
margin-top: 0;
margin-bottom: 3rem;
}

#header-bottom h2.saws-vpn-title {
width: 280px;
font-size: 18px;
}

#header-bottom .header-bottom-caption {
font-size: 72%;
color: #777;
}

#mainvisual-saws-vpn {
  width: 100%;
  background: url(/saws/images/main-saws-vpn.png) no-repeat center top;
  background-size: cover;
}

#saws-vpn-detail {
  padding: 3em 0;
  margin-bottom: 0;
  background: #f1f1f1;
}

#mainvisual-saws-vpn .inner {
  padding: 40px 0 0 0;
}

#mainvisual-saws-vpn img {
  max-width: 100%;
}

#mainvisual-saws-vpn .detail {
  height: 314px;
  background: url(/saws/images/main-image-bottom.png) no-repeat center bottom;
}

#mainvisual-saws-vpn .detail .detail-inner {
  position: relative;
  max-width: 980px;
  height: 314px;
  margin: 0 auto;
}

#mainvisual-saws-vpn .detail .detail-inner .text01 {
  width: 350px;
  height: auto;
}

#mainvisual-saws-vpn .detail .detail-inner .text02 {
  position: absolute;
  bottom: 0;
  right: 0;
  width: 300px;
  height: auto;
}

.mainvisual-saws-vpn-header {
  max-width: 980px;
  margin: 0  auto 30px auto;
}

.mainvisual-saws-vpn-header h1 {
  width: 395px;
  padding-top: 7px;
  float: left;
}

.mainvisual-saws-vpn-header .partner-logo {
  width: 150px;
  float: right;
}

#mainvisual-saws-vpn .caption {
  margin-bottom: 30px;
  font-size: 13px;
  text-align: center;
  line-height: 1.8;
}

#mainvisual-saws-vpn h2 {
  max-width: 980px;
  margin: 0 auto 50px auto;
}

#saws-vpn-detail h1.section-ttl {
  font-size: 28px;
  font-weight: bold;
}

#saws-vpn-detail h1.section-ttl strong {
  display: inline-block;
  margin-left: 10px;
  color: #EB7000;
}

#saws-vpn-detail p.caption {
  margin-bottom: 2em;
  font-size: 86%;
}

#saws-vpn-spec {
  margin-bottom: 0;
  padding: 3em 0;
  background: #d9d9d9;
}

#saws-vpn-spec section {
  margin-bottom: 2em;
}

#saws-vpn-spec ul {
  margin-bottom: 2em;
}

#saws-vpn-spec ul li {
  padding-left: 0.8em;
  margin-bottom: 0.3rem;
  background: url("/share/images/icon_ul_nolink.gif") no-repeat 0 0.5rem;
}

.saws-vpn-spec-table {
width:100%;
margin-bottom: 3em;
border-left: solid 1px #e1e1e1;
border-top: solid 1px #e1e1e1;
background: #fff;
}

.saws-vpn-spec-table th {
width: 33.333%;
padding: 15px;
border-right: solid 1px #e1e1e1;
border-bottom: solid 1px #e1e1e1;
text-align: center;
}

.saws-vpn-spec-table th .table-image {
margin-top: 10px;
}

.saws-vpn-spec-table th img {
width: auto;
height: 80px;
}

.saws-vpn-spec-table td {
width: 33.333%;
padding: 15px;
border-right: solid 1px #e1e1e1;
border-bottom: solid 1px #e1e1e1;
}

.saws-vpn-spec-table td.title {
background: #efefef;
text-align: right;
font-weight: bold;
}

.is-sp {
  display: none;
}



/* ------------------------------------------
                for small pc
------------------------------------------ */

@media(max-width:980px){

.mainvisual-saws-vpn-header {
  padding: 0 15px;
}

#mainvisual-saws-vpn .caption {
  padding: 0 15px;
}

#mainvisual-saws-vpn h2 {
  padding: 0 15px;
}

#mainvisual-saws-vpn .detail {
    height: 280px;
    background: url(/saws/images/main-image-bottom.png) no-repeat center bottom;
    background-size: 1000px 280px;
}

#mainvisual-saws-vpn .detail .detail-inner {
  height: 280px;
  margin: 0 15px;
}

#mainvisual-saws-vpn .detail .detail-inner .text01 {
  width: 260px;
}

#mainvisual-saws-vpn .detail .detail-inner .text02 {
  width: 230px;
}

}


/* ------------------------------------------
                 for tablet
------------------------------------------ */

@media(max-width:768px){

.content-saws section {
padding: 4em 1em;
box-sizing: border-box;
}

.content-saws section {
padding: 2em 1em;
}

#content h1.section-ttl {
font-size: 2em;
}

.saws-top-about-message-title {
font-size: 1.3em;
}

.saws-feature .icon {
font-size: 60px;
line-height: 1.3;
}

.saws-feature .title {
font-size: 1.2em;
}

.lead {
margin-bottom: 2em;
}

.saws-entries-recent a {
height: 300px;
}

.saws-entries-recent figure {
height: 300px;
}

.saws-entries-recent .entrydetail {
padding: 15px;
}

.saws-entries-recent {
margin-bottom: 1em;
}

.saws-entries ul li {
width: 49%;
margin: 0 2% 1em 0;
}

.saws-entries ul li:nth-child(3n) {
margin-right: 2%;
}

.saws-entries ul li:nth-child(2n) {
margin-right: 0;
}

.saws-entries ul li figure {
height: 180px;
overflow: hidden;
}

.entries-list a {
width: 100%;
}

.section-follow .col {
text-align: center;
}

.saws-vpn-section {
  padding-left: 15px;
  padding-right: 15px;
}

.saws-vpn-recommend .text {
    width: 100%;
    float: none;
    margin-bottom: 20px;
    padding-left: 15px;
    padding-right: 15px;
}

#saws-vpn-detail p.caption {
  text-align: center;
}

.saws-vpn-recommend .product-class {
    width: 100%;
    float: none;
    text-align: center;
}

#saws-vpn-spec {
  padding-left: 15px;
  padding-right: 15px;
}

}


/* ------------------------------------------
                 for sp
------------------------------------------ */

@media(max-width:480px){

#mainvisual {
padding: 3em 2em;
}

#content h1.section-ttl br {
display: none;
}

.col-group .col:last-of-type {
margin-bottom: 0;
}

.saws-entries-recent a {
height: 180px;
}

.saws-entries-recent figure {
height: 180px;
}

.saws-entries-recent .entrydetail {
padding: 10px;
}

.saws-entries .entrydate {
font-size: 72%;
}
.saws-entries-recent .entrytitle {
font-size: 79%;
line-heoght: 1.3;
font-weight: bold;
}

.saws-entries ul li {
width: 48%;
margin: 0 4% 1em 0;
}

.saws-entries ul li:nth-child(3n) {
    margin-right: 4%;
}

.saws-entries ul li:nth-child(2n) {
    margin-right: 0;
}

.saws-entries ul li figure {
height: 100px;
}

.saws-entries-recent a .label {
    top: 8px;
    right: -8px;
    padding: 5px 12px;
    font-size: 10px;
}

.saws-entries ul li a .label-media {
position: absolute;
top: 8px;
left: -8p;
padding: 5px 12px;
font-size: 10px;
}

.saws-entries-recent a .label-media {
position: absolute;
top: 8px;
left: -8p;
padding: 5px 12px;
font-size: 10px;
}

.mainvisual-saws-vpn-header h1 {
  width: 100%;
  float: none;
  margin-bottom: 10px;
}

.mainvisual-saws-vpn-header .partner-logo {
  width: 100%;
  float: none;
  text-align: center;
}

#mainvisual-saws-vpn .mainvisual-saws-vpn-header .partner-logo img {
  max-width: 150px;
}

#mainvisual-saws-vpn .inner {
    padding: 20px 0 0 0;
}

#mainvisual-saws-vpn .caption {
  font-size: 11px;
}

#mainvisual-saws-vpn h2 {
  margin-bottom: 30px;
}

#mainvisual-saws-vpn .detail .detail-inner .text02 {
  display: none;
}

#mainvisual-saws-vpn .detail {
    height: 340px;
    background-size: 700px 178px;
}

#mainvisual-saws-vpn .detail .detail-inner {
  height: 340px;
  text-align: center;
}

.is-sp {
  display: inline;
}

.is-pc {
  display: none;
}

.saws-vpn-top-box .image-right {
  margin-bottom: 15px;
  float: none;
  width: 100%;
  text-align: center;
}

.saws-vpn-top-box .detail-left {
    width: 100%;
    float: none;
}

.saws-vpn-top-box .image-left {
    width: 100%;
    margin-bottom: 15px;
    float: none;
    text-align: center;
}

.saws-vpn-top-box .detail-right {
    width: 100%;
    float: none;
}

#content h1.section-ttl {
    font-size: 1.5em;
}

#saws-vpn-top h2 {
  font-size: 1.3rem;
}

.saws-vpn-top-box {
    margin-bottom: 2em;
}

.saws-vpn-spec-table {
  font-size: 12px;
}

}