/*********/
/* Style */
/*********/

/*@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,400italic,600,600italic,700,700italic);*/
/*@import url(https://fonts.googleapis.com/css?family=Roboto+Slab:400,100,300,700);*/

body{
  font-family:Avenir, "Open Sans" , "Helvetica Neue" , Helvetica , Arial , Verdana , Roboto , "Meiryo UI" , "メイリオ" , Meiryo , "ＭＳ Ｐゴシック" , "MS PGothic" , sans-serif;
  /*font-family:Avenir, "Open Sans" , "Helvetica Neue" , Helvetica , Arial , Verdana , Roboto , "ヒラギノ角ゴ Pro W3" , "Hiragino Kaku Gothic Pro" , "Meiryo UI" , "メイリオ" , Meiryo , "ＭＳ Ｐゴシック" , "MS PGothic" , sans-serif;*/
  /*font-family:"Roboto Slab" , Garamond , "Times New Roman" , "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif;*/
  color:#333;
  font-size:12px;
  line-height:1.5em;
}

a{
  color:#888;
}

@media (min-width:480px) {
  a[href^="tel:"]{
    cursor:default;
  }
}

img{
  display: block;
  max-width: 100%;
  height: auto;
}

a > img{
  opacity:1;
  transition:.3s;
}

@media (max-width:480px) {
  a > img{
    margin:auto;
    margin-bottom:1px;
  }
}

a > img:hover,a > img:focus{
  opacity:.8;
  transition:.3s;
}

.section{
  margin:0;
  padding:30px 0;
}

.container {
  margin: 0 auto;
  /*max-width: 1000px;*/
}

.flex{
  display:flex;
}

.bg-gray{
  background-color:#f7f7f7;
}

.opacity{
  opacity:1;
  transition:.3s;
}

.opacity:hover,.opacity:focus{
  opacity:.7;
  transition:.3s;
}

.form-inline input{
  display:inline;
  width:auto;
}

/* Header */
#header{
  margin:0;
  padding:2px 0;
  border-bottom:solid 1px #ccc;
}

#header h1{
  margin:0;
  font-size:12px;
}

#header img{
  margin:auto;
}

@media (max-width:480px) {
  #header h1{
    text-align:center;
  }
  #header img{
    margin:auto auto 5px auto;
  }
}

#header .row > div{
  text-align:center;
}

#header .row > div > a.logo{
  padding:0;
}

#header .row > div > a:not(.logo){
  display:block;
  /*padding:0 0 10px 0;*/
  padding:6px 5px;
  /*font-size:14px;*/
  border:solid 1px rgb(239,239,239);
  color:rgb(129,129,129);
  text-decoration:none;
}

#header .row > div > a:not(.logo):hover,#header .row > div > a:not(.logo):focus{
  background-color:rgb(240,240,240);
}

@media (max-width:480px) {
  #header .row > div > a{
    padding:10px 0;
  }
}

#header .flex{
  /*margin-top:-10px;*/
}

#header .row > div > a.btn{
  /*margin-right:5px;*/
  /*margin-left:5px;*/
  /*margin-top:5px;*/
  /*width:100%;*/
  font-size:12px;
  color:#fff;
  border-radius:0;
}

#header .row > div > a.btn.btn-primary{
  background-color:rgb(45,45,45);
}
#header .row > div > a.btn.btn-warning{
  background-color:rgb(255,44,1);
}

/* Breadcrumb */
.breadcrumb{
  margin-top:20px;
}

/* Footer */
#footer{
  margin:0;
  padding:30px 0 0 0;
  background-color:rgb(197,0,1);
  color:#fff;
}

#footer .container{
  position:relative;
}

#footer a{
  color:#fff;
}

#footer ul {
  border-left:solid 2px #fff;
  padding-left:20px;
}

#footer ul li{
  line-height:2.0em;
}

#footer #copyright{
  margin:0;
  padding:2px 0;
}

#footer .scroll-top{
  position: absolute;
  top:-86px;
  right:10px;
}

/* NavBar */
.navbar{
  margin-bottom:0;
}

.navbar-inverse{
  border:0;
  background-color:#404040;
}

/* Carousel */
.carousel-inner .item{
  height:600px;
  overflow-y:hidden;
	padding:0px;
}

/* Jumbotron */
.jumbotron{
  height:500px;
  overflow-y:hidden;
  background-image:url(../img/top/main_visual.jpg);
  background-size:cover;
  background-repeat:no-repeat;
  background-position:center bottom;
  margin-bottom:0;
  color:#fff;
  text-shadow:0 2px 4px #000;
  border-top:solid 5px rgb(197,0,1);
  border-bottom:solid 20px rgb(197,0,1);
}

.jumbotron h2{
  /*padding:150px 0;*/
  padding:50px 0;
  text-shadow:0 2px 4px #000;
  font-size:3.5em;
  font-weight:bold;
  line-height:1.5em;
  color:#fff;
}

.jumbotron .row{
  padding:100px 0 0 0;
}

.jumbotron .row .btn-warning{
  border-radius:0;
  background-color:rgb(255,44,1);
  padding:10px;
}

@media (max-width:480px) {
  .jumbotron{
    height:100%;
    /*height:250px;*/
  }
  .jumbotron h2{
    padding:50px 0;
    font-size:1.5em;
  }
}

.jumbotron h2 span{
  color:#f14142;
  text-shadow:0 2px 4px #666;
}

.jumbotron.launch h2{
  /*padding:150px 0 50px 0;*/
}

@media (max-width:480px) {
  .jumbotron.launch h2{
    /*padding:20px 0 20px 0;*/
  }
}

/* Intro */
.intro{
  padding-bottom:0;
  text-align:center;
}

.intro h2{
  background-color:rgb(197,0,1);
  font-size:21px;
  font-weight:normal;
  color:#fff;
  padding:5px 0;
}

.intro h4{
  margin:40px auto;
  color:rgb(197,0,1);
}

.intro h4 a{
  color:rgb(197,0,1);
}

.intro p{
  color:rgb(197,0,1);
  font-size:14px;
  line-height:1.5em;
  margin:40px auto;
}

.intro a.btn.btn-warning{
  display:block;
  background-color:rgb(255,44,1);
  color:#fff;
  font-size:18px;
  margin:20px auto;
}

.intro p span{
  /*color:#223a70;*/
  /*font-size:110%;*/
}

@media (max-width:480px) {
  .intro p{
    font-size:12px;
  }
}

/* InfoTable */
.info-table{
  width:100%;
  /*max-width:600px;*/
}

.info-table tr{
  border-top:solid 1px #ccc;
}

.info-table tr:last-child{
  border-bottom:solid 1px #ccc;
}

.info-table th,.info-table td{
  padding:10px;
  background-color:#fff;
  border-right:solid 1px #ccc;
}

.info-table th{
  background-color:#efefef;
  border-left:solid 1px #ccc;
}

/* Button */
.btn{
  transition:.3s;
  text-shadow:none;
  margin-bottom:10px;
  transition:.3s;
}

.btn:hover,.btn:focus{
  opacity:.8;
  transition:.3s;
}

.btn-primary{
  background-color: rgb(0,92,255);
  border-color: rgb(0,92,255);
}

.btn-primary:hover{
  background-color: #5a5dbd;
  border-color: #5a5dbd;
}

.btn-warning{
  background-color: rgb(197,0,1);
  border-color: rgb(197,0,1);
  border:0;
}

.btn-warning:hover{
  background-color: #f46768;
  border-color: #f46768;
}

/* Checkout Area */
.checkout-area{
  /*background-image:url(../img/bg-checkout.png);*/
  /*background-size:cover;*/
  /*background-position:right bottom;*/
}

.checkout-area .col-xs-12{
  /*text-align:center;*/
}

/* Tab Layout */
.nav-tabs{
  border-bottom:0;
}

.nav-tabs > li{
  margin-bottom:0;
}

.nav-tabs > li > a{
  border:solid 2px #3134ac;
  /*background-color:#3134ac;*/
  /*color:#fff;*/
  color:#3134ac;
  /*font-weight:bold;*/
  text-align:center;
  transition:.3s;
  /*border-radius:0px;*/
  border-radius:5px;
  padding:10px 15px;
  margin:0 10px 5px 10px;
  /*width:100%;*/
  line-height:15px;
  /*display:table-cell;*/
  /*vertical-align:middle;*/
  cursor:pointer;
}

.nav-tabs > li > a:hover,
.nav-tabs > li > a:focus{
  border:solid 2px #3134ac;
  background-color:#3134ac;
  /*background-color:#fff;*/
  /*color:#3134ac;*/
  color:#fff;
  transition:.3s;
}

.nav-tabs > li.active > a,
.nav-tabs > li.active > a:hover,
.nav-tabs > li.active > a:focus{
  border:solid 2px #3134ac;
  color:#3134ac;
}

/* Project Box */
.box-project{
  border-radius:0px;
  background-color:#fff;
  margin:20px auto;
  padding:0 15px 0 15px;
  cursor:pointer;
  transform:scale(1);
  transition:.3s;
  box-shadow:0 0 4px #ccc;
  overflow:hidden;
}

.box-project:hover,.box-project:focus{
  /*opacity:.7;*/
  transform:scale(1.05);
  transition:.3s;
}

.box-project + div{
  border-radius:4px;
  background-color:rgb(239,239,239);
  margin:20px auto;
  padding:5px 15px 0px 15px;
  cursor:pointer;
  transform:scale(1);
  transition:.3s;
  box-shadow:0 0 4px #ccc;
  overflow:hidden;
}

.box-project + div h4{
  font-size:16px;
}

.box-project + div > .row > div{
  padding-left:0;
  padding-right:0;
}

/*.box-project:after{
  content:"";
  display:table;
  clear:both;
}*/

.box-project h3{
  font-size:18px;
  height:2em;
}

.box-project h3 + p{
  font-size:12px;
  color:#888;
  height:5em;
}

.box-project .clearfix p:not(.pull-right){
  width:70%;
}

.box-project .clearfix p.pull-right{
  width:30%;
}

.box-project .clearfix p{
  font-size:10px;
  color:#666;
  height:1.5em;
  overflow:hidden;
}

.box-project .progress-bar p{
  color:#fff;
}

.img-project{
  margin: 0px -15px 15px -15px;
  width:calc(100% + 30px);
  max-width:calc(100% + 30px);
  overflow: hidden;
  height: 230px;
}

.box-project > .img-project > img{
  margin:0 auto;
  height:230px;
  width: auto;
  max-width: none;
}

.box-project > img:after{
  content:"";
  position:absolute;
  width:100%;
  height:100%;
}

.box-project > .row{
  margin-bottom:20px;
}

.project-detail .table th,.project-detail .table td{
  vertical-align:middle;
  border:0;
  padding:2px 8px;
}

.project-detail .table th.col-xs-4{
  font-size:18px;
}

.project-detail .table tr:first-child td{
  font-size:28px;
}

.project-detail .btn{
  width:100%;
}

.project-detail .btn{
  display:inline;
}

.return-area{

}

.return-area .panel{
  border:solid 1px #ccc;
  border-radius:0;
  background-color:rgb(246,246,246);
}

.return-area .panel .panel-heading{
  background-color:rgb(197,197,197);
}

.return-area .panel .panel-heading h3{
  margin:5px auto;
  font-size:16px;
}

.return-area .panel .btn{
  background-color:rgb(197,0,1);
  color:#fff;
  width:100%;
  border:0;
}

.return-area .panel-default{
  border:solid 1px #ccc;
  border-radius:0;
  background-color:transparent;
}

/* Category List */
.cat-list h3{
  background-image:url(../img/bg_title_category.png);
  background-size:auto 100%;
  background-repeat:no-repeat;
  background-position:left;
  padding-left:30px;
  font-size:21px;
}

/*.cat-list h4{
  color:#3134ac;
  border-left:solid 12px #3134ac;
  padding:5px 0 3px 0;
  padding-left:4px;
  margin:5px auto;
}*/

.cat-list a{
  /*color:#3134ac;*/
  line-height:2.0em;
}

/* News List */
.news-list h3{
  background-image:url(../img/bg_title_news.png);
  background-size:auto 100%;
  background-repeat:no-repeat;
  background-position:left;
  padding-left:30px;
  font-size:21px;
}

.news-list table{
  margin-bottom:30px;
}

.news-list .table th,
.news-list .table td{
  vertical-align:middle;
}

.news-list a{
  /*color:#3134ac;*/
}

/* Sponser */
#title_sponser{
  background-image:url(../img/bg_title_sponser.png);
  background-size:auto 100%;
  background-repeat:no-repeat;
  background-position:left;
  padding-left:30px;
  font-size:21px;
}

/* Title Botder */
h2.title_border{
  margin-bottom:30px;
}

h2.title_border:after{
  content:"";
  display:block;
  border-bottom:solid 2px #3134ac;
  padding-top:10px;
  width:100px;
  /*width:150px;*/
  margin:auto 0;
  /*margin:auto;*/
}

h2.text-center.title_border:after{
  width:150px;
  margin:auto;
}

h2.title{
  text-align:center;
  color:rgb(197,1,0);
}

h3.title{
  font-size:16px;
}

.title-area h2{
  background-size:auto;
  background-repeat:no-repeat;
  background-position:left;
  padding:10px 0 10px 50px;
  font-size:28px;
  float:left;
}

.title-area a{
  float:right;
  margin-top:20px;
  border:0;
}

#title_new.title-area h2{
  background-image:url(../img/bg_title_new);
}

#title_new.title-area a{
  background-color:rgb(197,0,1);
}

#title_pickedup.title-area h2{
  background-image:url(../img/bg_title_pickedup);
}

#title_pickedup.title-area a{
  background-color:rgb(45,45,45);
}

/* Step */
.step_client{
}

.step_user{
}

.step_client h3 + p{
  height:5.5em;
}

.step_user h3 + p{
  height:5.5em;
  /*height:4.5em;*/
}

.step_client .row{
  min-height:130px;
}

.step_user .row{
  min-height:130px;
}

.step_client h3{
  width:100%;
  border-top:solid 5px rgb(0,92,255);
  padding-top:10px;
  color:rgb(0,92,255);
  font-size:21px;
}

.step_user h3{
  width:100%;
  border-top:solid 5px rgb(197,0,1);
  padding-top:10px;
  color:rgb(197,0,1);
  font-size:21px;
}

.step_client h4{
  color:rgb(0,92,255);
  font-weight:bold;
  margin:5px auto;
}

.step_user h4{
  color:rgb(197,0,1);
  font-weight:bold;
  margin:5px auto;
}

.step_client h4 + p{
  color:rgb(0,92,255);
}

.step_user h4 + p{
  color:rgb(197,0,1);
}

/* Project Content */
.project_content{
  margin-bottom:30px;
}

.project_content h3{
  border-bottom:solid 1px #3134ac;
  border-left:solid 12px #3134ac;
  padding-left:8px;
}

.project_content img{
  max-width:600px;
  width:100%;
}
