/***********************************************
 sub-stage
************************************************/
#sub-bg {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    margin: 0 auto;
    height: 100vh;
    width: 100%;
}
#sub-bg img{
    object-fit: cover;
  width: 100%;
  height: 100%
}
.bg-story{
    background: url(../images/story/bg.webp) no-repeat;
    background-size: cover;
    background-position: center center;
}
.bg-about{
    background: #000;
}
.bg-company{
    background: url(../images/company/bg.webp) no-repeat;
    background-size: cover;
    background-position: center center;
}
.bg-project{
    background: url(../images/project/bg.webp) no-repeat;
    background-size: cover;
    background-position: center top;
}
.bg-contact{
    background: url(../images/contact/bg.webp) no-repeat;
    background-size: cover;
    background-position: center center;
}
.bg-privacy{
    background: url(../images/privacy/bg.webp) no-repeat;
    background-size: cover;
    background-position: center center;
}
.bg-blog-list{
    background: url(../images/blog/bg.webp) no-repeat;
    background-size: cover;
    background-position: center top;
}
.bg-blog{
    background: url(../images/blog/bg2.webp) no-repeat;
    background-size: cover;
    background-position: center center;
}
.bg-oth{
    background: url(../images/common/bg-oth.webp) no-repeat;
    background-size: cover;
    background-position: center center;
}
#sub-bg span{
    position: absolute;
    display: block;	
    width: 100%;
	height: 100%;
    z-index: 1;	
    background: url(../images/common/dot.gif);
}
#sub-stage {
    min-height: 380px;
}
#sub-stage .inner {
    width: 90%;
    margin: 0 auto;
    display: flex;
    align-items: center;
    padding-bottom: 70px;
    min-height: 380px;
}
#sub-stage .inner h1{
    font-size: clamp(1.125rem, 0.411rem + 1.79vw, 1.75rem);
}
#sub-stage .inner h1 img{
    width: 100%;
    height: auto;
    max-width: 370px;
}
#sub-stage .inner h1 span{
    display: block;
    font-family: "Outfit", sans-serif;
    font-size: clamp(3.125rem, 1.696rem + 3.57vw, 4.375rem);
    line-height: 130%;
    white-space: nowrap;
}
.layer {
    position: relative;
    z-index: 2;
}
/***********************************************
 sub-contents
************************************************/
#sub-contents {
    padding: 50px 0 240px 0;
    width: calc(100% - 50px);
    position: relative;
    font-weight: 400;
    font-size: 15px;
}
#sub-contents:before {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: #000;
    transform: skewY(-5deg) translateY(-120px);
    z-index: -1;
}
#sub-contents .inner{
    max-width: 1200px;
    width: 90%;
    margin: 0 auto;
}
#sub-contents .inner section{
    margin: 0 0 60px 0;
}
#sub-contents .inner section .frm-wh{
    background: #fff;
    padding: 1em;
    border-radius: 5px;
}
/** 共通見出し **************************************/
#sub-contents .inner h2{
    font-size: clamp(1.375rem, 0.946rem + 1.07vw, 1.75rem);
    position: relative;
    min-height: 94px;
    display: flex;
    align-items: center;
    padding-left: 35px;
    margin:20px 0;
    letter-spacing: 1px;
}
#sub-contents .inner h2:before{
    position: absolute;
    content: "";
    left: 0;
    top: 0;
    background: url(../images/common/topics2-bg.svg) no-repeat;
    width: 125px;
    height: 94px;
    background-size: cover;
    z-index: -1;
}
.ct-contact .inner h3,
.ct-project .inner h3,
.ct-privacy .inner h3{
    font-size: clamp(1.125rem, 0.554rem + 1.43vw, 1.625rem);
    line-height: 120%;
    border: 1px solid #4d4d4d;
    box-sizing:border-box;
    padding: 17px 15px 15px 20px;
    margin:40px 0 30px 0;
    position: relative;
}
.ct-contact .inner h3:after,
.ct-project .inner h3:after,
.ct-privacy .inner h3:after{
    position: absolute;
    content: "";
    left: -1px;
    top: -3px;
    width: 5px;
    height: calc(100% + 6px);
    background: #000;
    border: 1px solid #4d4d4d;
}
#sub-contents table{
    width: 100%;
    border-top:1px solid #555;
    border-bottom: none;
    border-left: none;
    border-right: none;
    border-spacing: 0;
}
#sub-contents  table th{
    text-align: left;
    font-weight: 400;
    border-bottom:1px solid #555; 
    border-top: none;
    border-left: none;
    border-right: none;
    padding: 1.2em;
    white-space: nowrap;
    width: 15%;
}
#sub-contents  table td{
    text-align: left;
    font-weight: 400;
    border-bottom:1px solid #555; 
    border-top: none;
    border-left: none;
    border-right: none;
    padding: 1.2em;
}
#sub-contents  table td a{
    color: #1e84fe;
}
/** breadcrumbs **************************************/
#sub-contents .breadcrumbs {
    margin: -50px auto 0 auto;
    padding: 0 0 50px 0;
    font-size:12px;
    width: 90%;
}
#sub-contents .breadcrumbs  li {
    display: inline-block;
    color: #999;
    padding: 0 0 0 15px;
}
#sub-contents .breadcrumbs  li a{
    color: #fff;
}
#sub-contents .breadcrumbs  li a:hover::after {
    transform: scale(1, 1);
}
#sub-contents .breadcrumbs > li + li {
    position:relative;
}
#sub-contents .breadcrumbs > .active {
    color: #999;
}
#sub-contents .breadcrumbs > li + li:before {
    position: absolute;
    margin: 0 7px;
    padding: 0;
    color: #999;
    content: "";
    width: 1px;
    height: 15px;
    background: #ccc;
    top: 0;
    bottom: 0;
    left: 6px;
    margin: auto;
    transform: rotate(45deg);
}
#sub-contents .breadcrumbs > .active {
    color: #999;
}
/***********************************************
 story
************************************************/
/*** story-list *******************************/
.ct-story-list .search-column{
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: center;
    margin: 50px 0;
}
.ct-story-list  .search-box {
    display: flex;
    justify-content: center;
    width: 320px;
}
.ct-story-list  .search-box input#feas_0_0{
    border: 2px solid #fff;
    border-radius: 20px;
    background: #fff;
    font-size: 15px;
    padding: 7px 10px;
    width:200px;
    color: #fff;
    margin-right: 5px;
}
.ct-story-list  .search-box input#feas-submit-button-0{
    border: none;
    background: var(--gradation);
    font-size: 15px;
    padding: 7px 10px;
    color: #fff;
    border-radius: 3px;
    cursor: pointer;
    font-weight: 500;
}
.ct-story-list .search-box input[type="text"]:focus {
    border: 1px solid #403f44;
    outline: 0;
}
.ct-story-list .search-box input[type="text"]::placeholder {
    color: #777;
    font-weight: 500;
}
.ct-story-list .category-list {
    width: calc(100% - 360px);
}
.ct-story-list .category-list strong{
    display: block;
    font-size: clamp(1rem, 0.857rem + 0.36vw, 1.125rem);
    line-height: 130%;
    margin: 0 0 15px 0;
}
.ct-story-list .category-list ul{
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}
.ct-story-list .category-list ul:before{
    content:"";
    display: block;
    width:24%;
    order:1;
}
.ct-story-list .category-list ul:after{
    content:"";
    display: block;
    width:24%;
}
.ct-story-list .category-list ul li{
    width: 24%;
    margin-bottom: 10px;
    font-size: 15px;
}
.ct-story-list .category-list ul li a{
    color: #fff;
    background: #212121;
    padding: 5px 10px;
    display: block;
    position: relative;
}
.ct-story-list .category-list ul li a::after,
.ct-story-list .category-list ul li a::before,
.ct-story-list .category-list ul li a span::after,
.ct-story-list .category-list ul li a span::before {
  background-color: #00c6ff;
  content: '';
  display: block;
  position: absolute;
  z-index: 10;
  transition: all .3s ease;
  -webkit-transition: all .3s ease;
}
.ct-story-list .category-list ul li a::after {
    width: 0px;
    height: 1px;
    top: -1px;
    left: -1px;
}
.ct-story-list .category-list ul li a::before {
    width: 0px;
    height: 1px;
    right: -1px;
    bottom: -1px;
}
.ct-story-list .category-list ul li a span::after {
    width: 1px;
    height: 0px;
    left: -1px;
    bottom: -1px;
}
.ct-story-list .category-list ul li a span::before {
    width: 1px;
    height: 0px;
    top: -1px;
    right: -1px;
}
.ct-story-list .category-list ul li a:hover::after,
.ct-story-list .category-list ul li a:hover::before {
  width: 100%;
  width: calc(100% + 1px);
}
.ct-story-list .category-list ul li a:hover span::after,
.ct-story-list .category-list ul li a:hover span::before {
  height: 100%;
  height: calc(100% + 1px);
}
.ct-story-list .list-column .row{
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}
.ct-story-list .list-column  .row .set{
    width: 24%;
    position: relative;
    margin-bottom: 70px;
}
.ct-story-list .list-column  .row .set .showcase{
    width: calc(96% - 16px);
    padding: 8px;
    background: var(--gradation);
    overflow: hidden;
}
.ct-story-list .list-column  .row .set .showcase img {
    width: 100%;
    height: 160px;
    object-fit: cover;
    transition: all  0.2s ease;
}
.ct-story-list .list-column  .row .set .showcase img:hover{
    transform:scale(1.2,1.2);
}
.ct-story-list .list-column  .row .set h3{
    font-size: 18px;
    margin-left: 20px;
    margin-top: -35px;
    line-height: 130%;
    padding: 8px;
    border: 1px solid #fff;
    background: #000;
    box-sizing: border-box;
    position: relative;
    z-index: 2;
}
.ct-story-list .list-column  .row .set a h4{
    font-size: 15px;
    line-height: 140%;
    font-weight: 500;
    color: #fff;
    margin: 20px 0 20px 20px;
}
.ct-story-list .list-column  .row .set ul{
    margin-left: 20px;
    display: flex;
    flex-wrap: wrap;
}
.ct-story-list .list-column  .row .set ul li{
    margin-right: 5px;
    position: relative;
}
.ct-story-list .list-column  .row .set ul li:before{
    position: absolute;
    content: "";
    left: 3px;
    top: -2px;
    width: 4px;
    height: 8px;
    background: url(../images/common/clip.svg) no-repeat;
    background-size: cover;
}
.ct-story-list .list-column .row .set ul li a{
    display: inline-block;
    font-size: 12px;
    font-weight: 300;
    line-height: 120%;
    padding: 3px 7px;
    border: 1px solid #999;
}
/*** entry ************************************/
.ct-story-entry .story-title {
    margin: 0 0 30px 0;
    position: relative;
}
.ct-story-entry .story-title:before {
    position: absolute;
    content: "";
    left: -5%;
    top: -120px;
    width: 700px;
    height: 604px;
    background: url(../images/story/bg-idomu.webp) no-repeat;
    background-size: cover;
    z-index: -1;
}
.ct-story-entry .story-title dl{
    margin: 0;
    padding: 0;
    text-align: center;
}
.ct-story-entry .story-title dl dt h1{
    font-size: clamp(1.75rem, 0.464rem + 3.21vw, 2.875rem);
    line-height: 130%;
    margin-bottom: 50px;
}
.ct-story-entry .story-title dl dd{
    margin: 0;
    padding: 0;
}
.ct-story-entry .story-title dl dd span{
    font-size: clamp(1.125rem, 0.839rem + 0.71vw, 1.375rem);
    line-height: 130%;
    padding: 5px 15px;
    border: 5px solid;
    border-image: linear-gradient(to right, #00c6ff, #000081) 1; 
}
.ct-story-entry .story-title ul{
    margin: 40px auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}
.ct-story-entry .story-title ul li{
    margin-right: 5px;
    position: relative;
}
.ct-story-entry .story-title ul li:before{
    position: absolute;
    content: "";
    left: 3px;
    top: -2px;
    width: 4px;
    height: 8px;
    background: url(../images/common/clip.svg) no-repeat;
    background-size: cover;
}
.ct-story-entry .story-title ul li a{
    display: inline-block;
    font-size: 13px;
    font-weight: 300;
    line-height: 120%;
    padding: 7px 7px 5px 7px;
    border: 1px solid #999;
}
.ct-story-entry .story-title .share{
    display: flex;
    justify-content: flex-end;
    align-items: center;
    margin: 30px 0;
}
.ct-story-entry .story-title .share span{
    padding-right: 40px;
    font-family: "Outfit", sans-serif;
    font-weight: 400;
    position: relative;
}
.ct-story-entry .story-title .share span:before{
    position: absolute;
    content: "";
    right: 6px;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 27px;
    height: 1px;
    background: #fff;
}
.ct-story-entry .story-title .share ol{
    display: flex;
    width: 150px;
    justify-content: space-between;
}
.ct-story-entry .story-entry a{
    color: #1e84fe;
}
.ct-story-entry .story-related .row{
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}
.ct-story-entry .story-related .row .set{
    width: 24%;
    position: relative;
    margin-bottom: 30px;
}
.ct-story-entry .story-related .row .set .showcase{
    width: calc(96% - 16px);
    padding: 8px;
    background: var(--gradation);
    overflow: hidden;
}
.ct-story-entry .story-related .row .set .showcase img {
    width: 100%;
    height: 180px;
    object-fit: cover;
    transition: all  0.2s ease;
}
.ct-story-entry .story-related .row .set .showcase img:hover{
    transform:scale(1.2,1.2);
}
.ct-story-entry .story-related .row .set h3{
    font-size: 18px;
    margin-left: 20px;
    margin-top: -35px;
    line-height: 130%;
    padding: 8px;
    border: 1px solid #fff;
    background: #000;
    box-sizing: border-box;
    position: relative;
    z-index: 2;
}
.ct-story-entry .story-related .row .set a h4{
    font-size: 15px;
    line-height: 140%;
    font-weight: 500;
    color: #fff;
    margin: 20px 0 0 20px;
}
/***********************************************
 about
************************************************/
.ct-about p{
    line-height: 240%;
}
.ct-about dl{
    margin: 60px 0 0 0;
}
.ct-about dd{
    margin: 0;
    padding: 0;
}
.ct-about dd span{
    display: block;
    max-width: 122px;
    margin: 5px 0 0 0;
}
.ct-about dd span img{
    width: 100%;
    height: auto;
}
/***********************************************
 contact
************************************************/
.ct-contact .dial {
    font-size: 14px;
    font-weight: 400;
}
.ct-contact .dial a{
    position: relative;
    padding-left: 36px;
    min-height: 34px;
    font-family: "Outfit", sans-serif;
    font-size: 32px;
    font-weight: 400;
    margin-right: 15px;
}
.ct-contact .dial a:before{
    position: absolute;
    content: "";
    left: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    background: url(../images/contact/dial-ic.svg) no-repeat;
    width: 33px;
    height: 34px;
    background-size: cover;
}
/***********************************************
 privacy
************************************************/
.ct-privacy .inner p{
    font-size: 15px;
}
.ct-privacy .inner ol{
    counter-reset:order 0;
}
.ct-privacy .inner ol li h3::before{
    counter-increment:order 1;
    content: counter(order) ". ";
}
/***********************************************
 blog
************************************************/
.blog-wrap{
    display: flex;
    justify-content: space-between;
}
.blog-wrap main{
    width: calc(100% - 330px);
}
/*** list *************************************/
.blog-wrap .blog-list{
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}
.blog-wrap .blog-list .set:first-child{
    width: 100%;
    margin-bottom: 60px;
}
.blog-wrap .blog-list .set{
    width: 48%;
    margin-bottom: 60px;
}
.blog-wrap .blog-list .set .showcase {
    overflow: hidden;
}
.blog-wrap .blog-list .set .showcase img{
    width: 100%;
    height: auto;
    transition: all  0.2s ease;
}
.blog-wrap .blog-list .set .showcase img:hover{
    transform:scale(1.2,1.2);
}
.blog-wrap .blog-list .set:first-child a h3{
    font-size: clamp(1.125rem, 0.982rem + 0.36vw, 1.25rem);
    margin: 20px 0 0 0;
} 
.blog-wrap .blog-list .set a h3{
    color: #aaa;
    font-size: clamp(0.938rem, 0.866rem + 0.18vw, 1rem);
    line-height: 150%;
    margin: 10px 0 0 0;
}
/*** blog *************************************/
.blog-wrap main h1{
    font-size: clamp(1.5rem, 0.357rem + 2.86vw, 2.5rem);
    line-height: 130%;
    margin: 0 0 40px 0;
}
.blog-wrap main .ctg-list,
.blog-wrap aside .ctg-list{
    display: flex;
    flex-wrap: wrap;
    margin: 0 0 7px 0;
}
.blog-wrap main .ctg-list li,
.blog-wrap aside .ctg-list li{
    margin:0 10px 10px 0;
}
.blog-wrap main .ctg-list li a,
.blog-wrap aside .ctg-list li a{
    display: block;
    padding:7px 10px !important;
    font-size: 13px !important;
    line-height: 100% !important;
    border: 1px solid #aaa !important;
    position: relative;
}
.blog-wrap main .ctg-list li a:hover,
.blog-wrap aside .ctg-list li a:hover{
    border: 1px solid #fff !important;
}
.blog-wrap main .ctg-list li a:before,
.blog-wrap aside .ctg-list li a:before{
    position: absolute;
    content: "";
    left: 0;
    right: 0;
    bottom: -7px;
    margin: auto;
    width: 10px;
    height: 10px;
    background: url(../images/blog/line.svg) no-repeat;
    background-size: cover;
}
.blog-wrap main .ctg-list li a,
.blog-wrap aside .ctg-list li a{
    display: block;
    padding:5px 15px;
    font-size: 14px;
    border: 1px solid #fff;
}
.blog-wrap main .ctg-list li a span,
.blog-wrap aside .ctg-list li a span{
    position: relative;
    padding-left: 15px;
}
.blog-wrap main .ctg-list li a span:before,
.blog-wrap aside .ctg-list li a span:before{
    position: absolute;
    content: "#";
    left: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    color: #aaa;
    font-size: 14px;
    height: 14px;
    line-height: 100%;
}
.blog-wrap main .main-photo{
    margin: 25px 0;
}
.blog-wrap main .main-photo img{
    width: 100%;
    height: auto;
}
.blog-wrap main .blog-entry {
    padding: 0 0 40px 0
}
.blog-wrap main .blog-entry h3{
    position: relative;
    color: #ffffff;
    background: #000;
    transform: skewX(-5deg);
    border: 1px solid #4c4c4c;
    font-size: clamp(1.25rem, 1.107rem + 0.36vw, 1.375rem);
    padding: 15px;
    width: 80%;
    margin: 2em 0 1em 0;
}
.blog-wrap main .blog-entry h3:before{
    position: absolute;
    content: "";
    right: -20%;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 20%;
    height: 1px;
    background: #4c4c4c;
    z-index: 1;
}
.blog-wrap main .blog-entry h4{
    position: relative;
    font-size: clamp(1rem, 0.857rem + 0.36vw, 1.125rem);
    padding: 15px;
    margin: 2em 0 1em 0;
    border-bottom: 1px solid #4c4c4c;
}
.blog-wrap main .blog-entry h4:before{
    position: absolute;
    content: "";
    left: 0;
    bottom: -4px;
    width: 20%;
    height: 4px;
    background: #4c4c4c;
}
.blog-wrap main .blog-entry h5{
    font-size: clamp(0.938rem, 0.866rem + 0.18vw, 1rem);
    padding: 9px 15px 6px 15px;
    margin: 2em 0 1em 0;
    border: 1px solid #4c4c4c;
    position: relative;
}
.blog-wrap main .blog-entry h5:before{
    position: absolute;
    content: "";
    right: -1px;
    top: -1px;
    width: 16px;
    height: 16px;
    background: url(../images/blog/fusen.svg) no-repeat;
    background-size: cover;
}
.blog-wrap main .blog-entry ul,
.blog-wrap main .blog-entry ol{
    list-style: none;
    margin: 1em 0 2em 0;
    padding: 0;
}
.blog-wrap main .blog-entry ul li{
    position: relative;
    padding: 0 0 0 20px;
    margin: 10px 0;
}
.blog-wrap main .blog-entry ul li:before{
    position: absolute;
    content: "";
    left: 5px;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: #888;
}
.blog-wrap main .blog-entry ol{
    counter-reset: count 0;
}
.blog-wrap main .blog-entry ol li{
    position: relative;
    padding: 0 0 0 20px;
    margin: 10px 0;
}
.blog-wrap main .blog-entry ol li:before{
    position: absolute;
    content: "";
    left: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    content: counter(count) ". ";
    counter-increment: count 1;
    color: #fff;
}
.blog-wrap main .blog-bn{
    border: 1px solid #4c4c4c;
    box-sizing: border-box;
}
.blog-wrap main .blog-bn img{
    width: 100%;
    height: auto;
}
.blog-wrap aside{
    width: 250px;
}
.blog-wrap aside a.blog-top{
    display: block;
    font-size: clamp(1.125rem, 0.982rem + 0.36vw, 1.25rem);
    font-weight: 500;
    padding: 0 0 25px 0;
    position: relative;
}
.blog-wrap aside a.blog-top:before{
    position: absolute;
    content: "";
    left: 0;
    bottom: 0;
    width: 100%;
    height: 6px;
    background: url(../images/blog/color-bg.svg) no-repeat;
    background-size: cover;
}
.blog-wrap aside .side-ttl{
    font-size: clamp(1.125rem, 0.982rem + 0.36vw, 1.25rem);
    margin: 35px 0 20px 0;
}
.blog-wrap aside .pickup {
    margin: 0 0 30px 0;    
    line-height: 150%;
    font-size: 14px;
}
.blog-wrap aside .pickup a{
    color: #999;
}
.blog-wrap aside .pickup img{
    width: 100%;
    height: auto;
    display: block;
    margin-bottom: 10px;
}
@media screen and (max-width: 1200px) {
/***********************************************
 story
************************************************/
/** list ***************************************/
.ct-story-list .search-box {
    width: 100%;
}
.ct-story-list .category-list {
    width: 100%;
    margin-bottom: 20px;
}
.ct-story-list .list-column .row .set .showcase img {
    height: 120px;
}
/***********************************************
 blog
************************************************/
.blog-wrap main{
    width: calc(100% - 290px);
}
}
@media screen and (max-width: 980px) {
/***********************************************
 story
************************************************/
/** story-list ****************************/
.ct-story-list .category-list ul:before{
    display: none;
}
.ct-story-list .category-list ul:after{
    width:32%;
}
.ct-story-list .category-list ul li{
    width: 32%;
    font-size: 14px;
}
.ct-story-list .list-column .row:after{
    content:"";
    display: block;
    width:32%;
}
.ct-story-list .list-column .row .set{
    width: 32%;
}
/** entry ******************************/
.ct-story-entry .story-related .row .set{
    width: 48%;
}
/***********************************************
 blog
************************************************/
.blog-wrap{
    flex-wrap: wrap;
}
.blog-wrap main{
    width: 100%;
}
.blog-wrap aside{
    width: 100%;
}
.blog-wrap aside .rows{
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}
.blog-wrap aside .pickup {
    width: 32%;
}
}
@media screen and (max-width: 850px) {
}
@media screen and (max-width: 768px) {
/***********************************************
 story
************************************************/
/*** list ***********************************/
.ct-story-list .list-column .row .set h3{
    font-size: 16px;
    padding: 5px;
    margin-left: 15px;
}
.ct-story-list .list-column .row .set a h4{
    font-size: 14px;
    margin: 15px 0 15px 15px;
}
.ct-story-list .list-column .row .set ul{
    margin-left: 15px;
}
.ct-story-list .list-column .row .set{
    width: 49%;
}
.ct-story-list .list-column .row .set .showcase img {
    height: 160px;
}
}
@media screen and (max-width: 640px) {
/***********************************************
 sub-stage
************************************************/
#sub-stage .inner h1 img{
    max-width: 300px;
}
/***********************************************
 sub-contents
************************************************/
/** breadcrumbs ******************************/
#sub-contents .breadcrumbs {
    padding: 0 0 40px 0;
    margin: -100px auto 0 auto;
}
#sub-contents {
    padding: 50px 0 200px 0;
    width: 100%;
}
#sub-contents .inner section .frm-wh{
    padding: 0;
}
#sub-contents  table th{
    display: block;
    width: 100%;
    border-bottom:none; 
    padding: .6em .6em .3em .6em;
    box-sizing: border-box;
}
#sub-contents  table td{
    padding: .3em .6em .6em .6em;
    display: block;
    width: 100%;
    box-sizing: border-box;
}
/***********************************************
 story
************************************************/
/*** list **************************************/
.ct-story-list .search-box {
    width: 250px;
}
.ct-story-list .search-box input#feas_0_0{
    width:170px;
}
.ct-story-list .search-box input#feas-submit-button-0{
    padding: 7px 5px;
}
.ct-story-list .category-list ul:before{
    display: none;
}
.ct-story-list .category-list ul:after{
    display: none;
}
.ct-story-list .category-list ul li{
    width: 49%;
    margin-bottom: 5px;
    font-size: 13px;
}
.ct-story-list .category-list ul li a{
    padding: 5px;
}
/*** entry *************************************/
.ct-story-entry .story-title:before {
    left: -5%;
    top: -20px;
    width: 90%;
    height: auto;
    padding-top: 85%;
}
.ct-story-entry .story-title dl dt h1{
    text-align: left;
}
.ct-story-entry .story-related .row .set .showcase img {
    height: 120px;
}
.ct-story-entry .story-related .row .set h3{
    font-size: 16px;
    margin-left: 15px;
    padding: 5px;
}
.ct-story-entry .story-related .row .set a h4{
    font-size: 14px;
    margin: 15px 0 0 15px;
}
/***********************************************
 contact
************************************************/
.ct-contact .dial a{
    display: block;
    padding-left: 27px;
    white-space: nowrap;
}
.ct-contact .dial a:before{
    width: 25px;
    height: 26px;
}
/***********************************************
 blog
************************************************/
/*** list *************************************/
.blog-wrap .blog-list .set{
    width: 47%;
    margin-bottom: 40px;
}
}
@media screen and (max-width: 540px) {
/***********************************************
 story
************************************************/
/*** list *************************************/
.ct-story-list .list-column .row .set .showcase img {
    height: 120px;
}
}
@media screen and (max-width: 450px) {
/***********************************************
 story
************************************************/
/*** list *************************************/
.ct-story-list .list-column .row .set{
    width: 100%;
    margin-bottom: 40px;
}
.ct-story-list .list-column  .row .set .showcase img {
    height: 160px;
}
}
@media screen and (max-width: 400px) {
/***********************************************
 story
************************************************/
/*** list *************************************/
.ct-story-list .category-list ul li{
    width: 100%;
}
/*** entry *************************************/
.ct-story-entry .story-related .row .set{
    width: 100%;
}
.ct-story-entry .story-related .row .set .showcase img {
    height: 160px;
}
/***********************************************
 blog
************************************************/
/*** list *************************************/
.blog-wrap .blog-list .set{
    width: 48%;
}
/*** aside *************************************/
.blog-wrap aside .pickup {
    width: 100%;
}
}
@media screen and (max-width: 300px) {
}