/*
=========================================================
Editor		: OH00
Version		: 1.0
Since		: 2017-03-31
Last Up Date	:  2017-03-31 00:00
=========================================================

[Index]
- wrapper css / Do not change
	- header
	- global nav
	- footer
	- content

================================================= */
/* all reset */
#comHeader h1, #comHeader h2, #comHeader h3, #comHeader h4, #comHeader h5, #comHeader h2 + .h3, #comHeader section, #comHeader h3 + p, #comHeader h3 + ul, #comHeader h4 + p, #comHeader h4 + ul, #comHeader h3 + table, #comHeader h4 + table, #comHeader section > h4:first-child, #comHeader section > h3:first-child, #comHeader p, #comHeader ul, #comHeader dl, #comHeader table, #comHeader p img,
#comHeader li img, #comHeader dt img, #comHeader dd img {
    margin-top: 0;
    margin-bottom: 0;
}

#comFooter h1, #comFooter h2, #comFooter h3, #comFooter h4, #comFooter h5, #comFooter h2 + .h3, #comFooter section, #comFooter h3 + p, #comFooter h3 + ul, #comFooter h4 + p, #comFooter h4 + ul, #comFooter h3 + table, #comFooter h4 + table, #comFooter section > h4:first-child, #comFooter section > h3:first-child, #comFooter p, #comFooter ul, #comFooter dl, #comFooter table, #comFooter p img,
#comFooter li img, #comFooter dt img, #comFooter dd img {
    margin-top: 0;
    margin-bottom: 0;
}

#comSide h1, #comSide h2, #comSide h3, #comSide h4, #comSide h5, #comSide h2 + .h3, #comSide section, #comSide h3 + p, #comSide h3 + ul, #comSide h4 + p, #comSide h4 + ul, #comSide h3 + table, #comSide h4 + table, #comSide section > h4:first-child, #comSide section > h3:first-child, #comSide p, #comSide ul, #comSide dl, #comSide table, #comSide p img,
#comSide li img, #comSide dt img, #comSide dd img {
    margin-top: 0;
    margin-bottom: 0;
}


/* --------------------------------------------
header
----------------------------------------------- */
#comHeader {
    max-width: 1153px;
    height: 96px;
    position: relative;
}

    #comHeader a {
        text-decoration: none;
        color: #000;
    }

#headLogo {
    width: 169px;
}

#headGroupLogo {
    position: absolute;
    top: 0px;
    right: 0px;
    width: 81px;
}

#headMenu {
    position: absolute;
    top: -2px;
    right: 117px;
}

    #headMenu::after {
        content: "";
        display: block;
        width: 0;
        height: 0;
        clear: both;
    }

    #headMenu .headLink {
        float: left;
        font-size: 16px;
        margin-top: 2px;
    }

        #headMenu .headLink a:hover {
            text-decoration: underline;
        }

    #headMenu .searchArea {
        float: left;
        width: 16px;
        overflow: hidden;
        -webkit-transition: width 0.5s ease;
        -moz-transition: width 0.5s ease;
        -o-transition: width 0.5s ease;
        -ms-transition: width 0.5s ease;
        transition: width 0.5s ease;
    }

        #headMenu .searchArea.on {
            width: 280px;
        }

        #headMenu .searchArea form {
            padding-left: 26px;
            padding-top: 2px;
            background-image: url(/common/images/search_ico.gif);
            background-repeat: no-repeat;
            background-position: 0 50%;
            background-size: 16px 16px;
            cursor: pointer;
        }

        #headMenu .searchArea input {
            -webkit-box-sizing: border-box;
            -moz-box-sizing: border-box;
            -o-box-sizing: border-box;
            -ms-box-sizing: border-box;
            box-sizing: border-box;
            display: block;
            outline: 0;
            width: 100%;
            border: none;
            border-bottom: solid 1px #000000;
            font-size: 13px;
            line-height: 1.2;
            color: #000000;
            -webkit-appearance: none;
            border-radius: 0;
            vertical-align: middle;
        }

        #headMenu .searchArea span.placeholder {
            font-size: 13px;
        }

        #headMenu .searchArea input:-ms-input-placeholder {
            color: #fff;
        }

    #headMenu .hnav {
        float: left;
        margin: 4px 20px 0;
        padding-right: 21px;
        position: relative;
    }

        #headMenu .hnav::after {
            content: "";
            display: block;
            width: 1px;
            height: 11px;
            position: absolute;
            right: 0px;
            top: 50%;
            margin-top: -5.5px;
            background-color: #000000;
        }

        #headMenu .hnav ul::after {
            content: "";
            display: block;
            width: 0;
            height: 0;
            clear: both;
        }

        #headMenu .hnav ul li {
            float: left;
            margin-left: 20px;
            font-size: 16px;
            line-height: 1.2;
        }

            #headMenu .hnav ul li:first-child {
                margin-left: 0;
            }

    #headMenu .headLang {
        float: left;
        font-size: 0;
        margin-top: 4px;
    }

        #headMenu .headLang strong,
        #headMenu .headLang span,
        #headMenu .headLang a {
            position: relative;
            display: inline-block;
            vertical-align: middle;
            font-size: 14px;
            line-height: 1.2;
            font-weight: normal;
        }

        #headMenu .headLang span,
        #headMenu .headLang a {
            margin-left: 0.5em;
        }

            #headMenu .headLang span::after,
            #headMenu .headLang a:hover::after {
                content: "";
                position: absolute;
                bottom: -4px;
                left: 0;
                width: 100%;
                height: 2px;
                background-color: #000000;
            }


/* global nav
----------------------------------------------- */
#gnav {
    position: absolute;
    top: 33px;
    right: 117px;
    z-index: 150;
}

    #gnav nav > ul {
        text-align: left;
        font-size: 12pt;
    }

        #gnav nav > ul + ul {
            display: none;
        }

        #gnav nav > ul > li {
            display: inline-block;
            vertical-align: top;
            font-size: 18px;
           
            line-height: 1.2;
            margin-left: 25px;
            position: relative;
        }

            #gnav nav > ul > li:first-child {
                margin-left: 0px;
            }

            #gnav nav > ul > li > p a {
                position: relative;
                z-index: 1;
                text-transform: uppercase;
            }




            #gnav nav > ul > li a:hover,
            #gnav nav > ul > li.selected > a,
            #gnav nav > ul > li.selected > a:hover {
                color: #005bac;
            }

            #gnav nav > ul > li.active > p a,
            #gnav nav > ul > li.selected > p a:hover {
                border-bottom: 2px solid #d1d1d1;
                background-color: #D1D1D1;
            }


            #gnav nav > ul > li .megaDrop {
                position: absolute;
                top: 34px;
                left: 0px;
                width: 100%;
                text-align: left;
                /* background: url("../../Images/line.jpg") repeat-y;*/
                z-index: 0;
                display: none;
            }

            #gnav nav > ul > li.active .megaDrop {
                z-index: 100;
            }

            #gnav nav > ul > li .megaDrop .inner .catTl {
                background-color: rgba(0,95,171,0.9);
                min-width:350px;
                text-align:right;
            }

                #gnav nav > ul > li .megaDrop .inner .catTl p {
                    
                    font-size: 76px;
                    line-height: 1;
                    color: #ffffff;
                    margin-top: -6px;
                    text-transform: uppercase;
                }

            #gnav nav > ul > li .megaDrop .inner .detail {
                background-color: rgba(209,209,209,0.9);
                /* add / The block is not able to set 'min-height', because of 'table-cell'. height will work as same as 'min-height' when using 'table-cell'. */
            }





            #gnav nav > ul > li .megaDrop .bottom-line {
                width: 100%;
                height: 32px;
                background-color: #195a90;
                display: inline-flex;
                align-items: center;
            }

                #gnav nav > ul > li .megaDrop .bottom-line .bottom-line-close {
                    width: 1153px;
                    margin: 0 auto;
                    text-align: right;
                    padding-right: 20px;
                    display: inline-flex;
                    align-items: center;
                    justify-content: flex-end;
                }



            #gnav nav > ul > li .megaDrop .inner .detail ul {
                display: flex;
                flex-wrap: wrap;
                text-align:left;
            }



                #gnav nav > ul > li .megaDrop .inner .detail ul li {
                    list-style: none;
                    padding: 20px 5px;
                }

                #projects1{
                    width:190px;
                }

#company1{
    width:190px;
}

#company2 {
    width: 210px;
}

#company3,#company4 {
    width: 160px;
}


#air1{
  width:200px;
}

#air2{
 width:280px;
}
#air3{
    width:300px;
}

#air4 {
    width: 200px;
}

#air5 {
    width: 280px;
}

#air6 {
    width: 300px;
}

#sulfur1{
    width:240px;
}

#sulfur2 {
    width: 260px;
}

#sulfur3 {
    width: 240px;
}

#sulfur4{
    width: 240px;
}

#sulfur5{
    width: 260px;
}


#projects2 {
    width: 250px;
}

#projects3 {
    width:190px;

}

#projects4{
    width: 260px;
}
#projects5{
    width:250px;
}

#projects6 {
    width: 160px;
}
#projects7{
    width:190px;
    margin-left:30px;
}

#news1{
    width:120px;
}
#news2 {
    width:210px;
}
#news3{
    width:420px;
}

#Sustaninability1{
    width: 210px;
}

#Sustaninability2{
    width: 100px;
}

#Sustaninability3{
    width:100px;
}

#Sustaninability4{
    width: 190px;
}

                #gnav nav > ul > li .megaDrop .inner .detail ul + hr {
                    border-bottom: none;
                    border-top: solid 1px #737373;
                    margin: 24px 0;
                }

                    #gnav nav > ul > li .megaDrop .inner .detail ul + hr + ul.comSubNv li {
                        font-size: 14px;
                    }

                    #gnav nav > ul > li .megaDrop .inner .detail ul + hr + ul.comSubNv.col1 li {
                        float: none;
                        width: auto;
                    }

            #gnav nav > ul > li .megaDrop .close {
                position: absolute;
                top: 30px;
                right: 72px;
                width: 13px;
                height: 13px;
                overflow: hidden;
                text-indent: 100%;
                white-space: nowrap;
                cursor: pointer;
            }

                #gnav nav > ul > li .megaDrop .close::before {
                    display: block;
                    content: "";
                    position: absolute;
                    top: 50%;
                    left: -1px;
                    width: 15px;
                    height: 2px;
                    margin-top: -1px;
                    background: #000;
                    transform: rotate(45deg);
                    -webkit-transition: background .2s;
                    transition: background .2s;
                }

                #gnav nav > ul > li .megaDrop .close::after {
                    display: block;
                    content: "";
                    position: absolute;
                    top: 50%;
                    right: -1px;
                    width: 15px;
                    height: 2px;
                    margin-top: -1px;
                    background: #000;
                    transform: rotate(-45deg);
                    -webkit-transition: background .2s;
                    transition: background .2s;
                }

                #gnav nav > ul > li .megaDrop .close:hover::before,
                #gnav nav > ul > li .megaDrop .close:hover::after {
                    background: #666;
                }

    #gnav .searchArea,
    #gnav .headLink,
    #gnav .headLang,
    #spMenuBtn {
        display: none;
    }

/* for IR ajust font-size
#gnav nav > ul > li > p a span.al,
#gnav nav > ul > li .megaDrop .catTl p > span.al,
#comContent h1.comSecH1 span.al{
	font-size:116%;
	font-family:'Noto Sans CJK JP Medium', Arial, Helvetica, sans-serif;
} */


/* not responsive
----------------------------------------------- */
#comHeader.nores {
    width: 1153px;
    height: 100px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    margin: 0 auto;
}

    #comHeader.nores #headLogo {
        width: 169px;
        height: 41px;
        margin-left: 20px;
        margin-bottom: 5px;
    }

        #comHeader.nores #headLogo img {
            /*   height: 41px;*/
        }

    #comHeader.nores #headGroupLogo {
        width: 81px;
        right: 30px;
    }



    #comHeader.nores #spMenuBtn {
        display: none;
    }

    #comHeader.nores #gnav {
        top: 65px;
        right: 0;
        left: auto;
        width: auto;
        display: block;
        padding-bottom: 0;
        background-color: transparent;
        -webkit-box-shadow: none;
        -moz-box-shadow: none;
        box-shadow: none;
    }

        #comHeader.nores #gnav nav > ul {
            width: auto;
            margin: 0;
        }

            #comHeader.nores #gnav nav > ul > li {
                display: inline-block;
                font-size: 12pt;
                margin-left: 30px;
            }

                #comHeader.nores #gnav nav > ul > li:first-child {
                    margin-left: 0;
                }

                #comHeader.nores #gnav nav > ul > li > a,
                #comHeader.nores #gnav nav > ul > li > p a {
                    padding: 15px;
                }



                #comHeader.nores #gnav nav > ul > li .megaDrop .inner {
                    width: 1153px;
                    overflow: hidden;
                    padding: 0;
                    display: flex;
                    margin: 0 auto;
                    height: 250px;
                }



                        #comHeader.nores #gnav nav > ul > li .megaDrop .inner .catTl p {
                            
                            display: inline-flex;
                            justify-content: flex-end;
                            padding: 47px 60px 0 0;
                            font-size: 32px;
                            font-weight:bold;
                        }

                    #comHeader.nores #gnav nav > ul > li .megaDrop .inner .detail {
                        width:100%;
                        padding-top: 35px;
                    }



                #comHeader.nores #gnav nav > ul > li .megaDrop .close {
                    bottom: 20px;
                    right: 72px;
                    font-size: 16px;
                    padding-right: 28px;
                    background-size: 21px 12px;
                }




.comHeaderFollow {
    position: fixed;
    z-index: 99;
    left: 0;
    top: 0;
    width: 100%;
    background: #fff;
    opacity: 1;
    -webkit-transition: top .3s ease, padding .1s ease-out, opacity .3s ease;
    transition: top .3s ease, padding .1s ease-out, opacity .3s ease
}

    /*
.isScrolled.isHeaderHide .comHeaderFollow {
    opacity: 0
}
*/

.comHeaderFollow #comHeader {
    margin: 0 auto
}


.comHeaderFollow #comHeader {
    margin: 0 auto
}

.comHeaderFollow:hover {
    opacity: 1
}




#gnav {
    -webkit-transition: .3s ease;
    transition: .3s ease
}


/*
.isScrolled #search,
.isScrolled #headLogo,
.isScrolled #gnav {
    visibility: hidden;
    opacity: 0;
    -webkit-transition: .3s ease;
    transition: .3s ease
}


.isScrolled .comHeaderFollow:hover #gnav, .isScrolled .comHeaderFollow:hover #headLogo, .isScrolled .comHeaderFollow:hover #search {
    visibility: visible;
    opacity: 1;
    -webkit-transition: .3s ease;
    transition: .3s ease
}
*/
@media only screen and (min-width: 992px) and (max-width:1440px) {
}