@import url('//maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css');


#footer{
    display: flex;flex-flow: row wrap;
    background:#fff;
    font-family: 'Oswald', sans-serif;
    border-top:1px solid #111;
}
.fooTp{
    width:100%;
    z-index: 201;
}
.foo-logo img {
  width:auto; height:auto;
}
.footp-title{
    color:#111;font-size:1.2rem;font-weight: 600;
}
.footp-inner{
  width:1730px;margin:0 auto;
  padding:30px 0px;
  display: flex;justify-content: space-between;align-items: center;
}
.foobt-inner{
  width: 1730px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1fr;
}
.wrap { line-height:1.5; }
.info  { width:100%; height: auto; }
.info li { padding:10px 0; }
.info h3 { color:#111; font-size:15px; font-weight: 400; }
.footer_mo { display: none; }
.sns {
  width:100%; height: auto;
  display: flex;
}
.sns ul {
  display: flex;
  margin-top:20px;
}
.sns ul li {
  margin-right:15px;
}
.sns ul li a { 
  display: block;
  width:100%; height:100%;
  margin:0 auto;
  transition: all .3s;
  color:#111;
}
.sns ul li:nth-child(1):hover a {
  background: linear-gradient(to top, #ffd153,#ff5541, #c141a1, #7e3fcb);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
 }
.sns ul li:nth-child(2):hover a { color:#3b5999; }
.sns ul li:nth-child(3):hover a { color:#52a745; }

.sns ul i {
  font-size:2.5em;
}
.foobt{
    width:100%;
    z-index: 200;
}
.footp-con ul {
    display: flex;
    flex-flow:column wrap;
}
.footp-con ul li{
    display: flex;
    width:100%; margin:10px 0;
    font-size:15px;margin-top:10px;color:#111
}

.footp-con ul li span{
    width:65px;
}

.footp-con ul li p{
    color:#fff;font-weight: 300;
}



.footp-follow ul{
    display: flex;justify-content: space-between;
}
.footp-follow ul li:nth-child(1) a {
    background-color:#be252d;
}
.footp-follow ul li:nth-child(2) a{
    background-color:#dd4937;
}
.footp-follow ul li:nth-child(3) a{
    background-color:#2157c9;
}
.footp-follow ul li:nth-child(4) a{
    background-color:#1cace4;
}
.footp-follow ul li:nth-child(5) a{
    background-color:#c82b34;
}
.footp-follow ul li a{
    width:50px;height: 50px;border-radius: 50%;
    background: #444;display: flex;align-items: center;justify-content: center;
}

.footp-follow ul li a:hover{
    background:#3c3c3c;
    transition: .4s ease;
}
.footp-follow ul li a:hover i {
    color:#f6f6f6;
}
.footp-follow ul li a:hover i {
    font-size:2em;
}
.footp-follow ul li a i{
    color:#fff;
    font-size:1.8em;
}
.footp-follow ul li:not(:nth-of-type(1)){
    margin-left:5px;
}
.footp-site {
  display: flex;
  flex-flow: column wrap;
  align-content: flex-end;
  justify-content: space-between;
}
.footp-site-sel{
    margin-right: 65px;
    position: relative;
}
.footp-site-sel>.site-wrap>li p {
    padding:15px 30px;
    border:1px solid #111;
    color:#111; width:auto;
    cursor: pointer;
}
.footp-site h2 {
  font-size: 35px;
  font-weight: 600;
  letter-spacing: -1px;
}
.site-wrap li p i{
    margin-left:10px;
    font-size:1rem;
    align-self: flex-start;
}

.site-wrap-sub{
    position: absolute;bottom:100%;left:0;
    width:100%;display: none;
}
.site-wrap-sub.on {
    display:block;
}
.site-wrap-sub>li {
    border-bottom:1px solid #111;
}
.site-wrap-sub>li>a{
    display: block;padding:15px 35px 15px 25px;
    background: rgb(255, 255, 255);
    color:#222;
    font-weight: 500;
}
.site-wrap-sub>li:last-child {
  border-top:1px solid #111;
  border-left:1px solid #111;
  border-right:1px solid #111;
}

.site-wrap-sub>li a:hover{
    background:#111;
    color:#fff;
    transition: .4s ease;
}

.foobt{
    background-color:#fff;
    padding:35px 0px;
}
.foobt-copy {
    display: block;
}
.foobt-copy p {
    margin-left:250px;
    color:#111;
}
.foobt-copy strong, .foobt-copy h3 {
    display: block;
    color:#111;
    font-size:16px;
    font-weight: 400;
    padding:10px 0;
}
.foobt-nav ul{
    display: flex;
    margin:10px 0;
}
.foobt-nav ul li a{
    font-weight: 300;
    font-size:17px;
    color:#111;
}

@media screen and (max-width:1600px) {
    .foobt-inner { width:90%; } 
    .foobt-inner {
        width: 90%;
    }
    .foobt-copy {
      display: flex;
      width: 100%;
    }
    .footp-inner{
        width:90%;display: flex;flex-flow:row wrap;
    }

    .foobt-copy p {
       margin-left: 20px;
    }
    .footp-con ul li {
      margin-top: 10px;
    }
    .foo-logo{width:100%;margin-bottom: 10px;}

    .footp-title{
       font-size:1.1rem;
    }
    .footp-site-sel{
        margin-right: 70px;
        position: relative;
    }

}


@media screen and (max-width:900px){
    .footp-inner{
        width:95%;display: flex;flex-direction: column;align-items: flex-start;
        flex-flow:row wrap;justify-content: space-between;
        padding:20px;
    }
    .footp-title{
      font-size:1.1rem;
    }
    .footp-site .fa {
        display:none;
    }
    .foo-logo{width:100%;margin: 20px 0px;}

    .footp-con{
        width:100%;
        margin-bottom: 20px;
    }


    .footp-follow{
        margin-bottom: 50px;
    }

    .footp-site-sel{
        margin-right: 70px;
        position: relative;
    }

    .foobt-inner{
        width:90%;margin:0 auto;
        display: flex;justify-content: space-between;flex-flow:column wrap;
    }
    .foobt-copy {
      display: flex;
      width: 100%;
      flex-flow: column;
      line-height:1.5
    }
    .foobt-copy span {
      font-size: 15px;
    }
    .foobt-copy p{
        margin-left:0;
        font-size: 12px;
        width: 83%;
    }

}

@media screen and (max-width:600px){
    .info p { font-size:15px; }
    .info li { padding:5px 0; }
    .footer_mo { display: block; }
    #footer {
      padding: 0 0 40px;
    }
    .footp-con ul li{
        display: flex;align-content: center;flex-flow: row wrap;
    }
    .footp-con ul li span{
        width:100%;margin-bottom: 10px;;
    }
    .foobt  { padding:25px 0; }
    .foobt-nav {
      height: 215px;
    }
    .foobt-nav ul{
        display: flex;flex-flow: row wrap;
    }
    .foobt-nav ul li{
        margin-bottom: 10px;
    }
    .footp-inner {
      width: 95%;
      padding: 10px;
      font-size:12px;
    }
    .foobt-nav ul {
      margin:20px 0;
    }
    .footp-title {
      margin-bottom: 15px;
    }
    .footp-con ul li p {
      font-size:12px;
      width:120%;
    }
    .foobt-copy p {
        width: 100%;
        font-size:12px;
    }
    .foo-logo {
      width: 100%;
      margin:30px 0 20px;
    }
    #header #all_menu .menu_tit { font-size:20px; margin:20px 0; }

}